ES6快速入门（一）

1. 变量定义(let)和常量定义(const)

let 定义变量 （浏览器已经支持），有块级别作用域（只在本块有用，不会影响其他的）

{
let a = 12;
}
alert(a); //不能用
复制代码

应用：可解决i值的问题。

let aBtn = document.getElementsByTagName('input');
for (let i = 0;i <aBtn.length;i++){
aBtn[i].onclick = function(){
     alert(i);   //点谁就弹几
 };
}复制代码

注意：let不能重复定义同一变量。
错误示例：

'use strict'
let a = 12;
let a = 5;
alert(a); //会报错复制代码

定义常量(const)

const a = 'Tab';
alert(a);复制代码

1、不能重复定义
2、常量不能修改复制代码

2.字符串模板引擎（字符串拼接）

Es6的这种新的“字符串拼接”方法比较简单，没有繁琐的加号和引号，只需要在所需要的字符串“边界”加上``即可。（键盘 tab上面那个键 ${变量} 键盘 tab上面那个键）

var name = `Datura`;
var age = 18;
var sex = `其它`;
var hobby = `敲代码`;
var str1 = `我是$(name},今年${age}岁,性别${sex}的了,爱好${hobby}`; //注意此处有两个“ `` ”
var str2 = '我是'+name+'，今年'+age+'岁，性别'+sex+'，爱好'+hobby+''; //这个是原来的写法
alert(str1);复制代码

3. 解构赋值

就根据“对应”赋值，请看以下几个例子：

'use strict';
let a = 12;
let b = 5;
let c = 8;
//相当于
let [a,b,c] = [12,5,8];
console.log(a,b,c); //12 5 8复制代码

json格式的赋值

let {a,b,c} = {a:12,b:5,c:8};
console.log(a,b,c);  //12 5 8
//数值里面嵌套数组
let [a,[b,c],d] = [12,[1,3],8];
console.log(a,b,c,d); //12 1 3 8复制代码

与顺序无关，与结构有关（左右结构一致）：

let {a,b,c} = {b:5,a:12,c:8};
console.log(a,b,c); //12 5 8复制代码

应用，我们现在利用jsonp获取了一组数据

let json = {
        q:"aaa",
         p:false,
         s:["aaa云主机","爱奇艺vip免费试用","啊aaaaaaaa视频","aaaa","爱奇艺","aaa电池","工商银行","aaai","aaa短信轰炸机"]

};

let {s,q} = json;
console.log(s,q);  ////s为那组数组的数据，q为字符串aaa复制代码

解构赋值的默认值问题

let {time = 1000,id = 0} = {};
console.log(time,id);  //1000 0复制代码

4.神奇的“三个点”

之前的文章曾提到过数组或者对象的深浅拷贝问题，今天就利用es6的三个点来处理下。

var arr = [12,5,8];
arr2 = arr;
arr2.pop();
alert(arr); //12 5复制代码

上面的代码就是arr2与arr公用一段内存地址，所以导致srr2数据改变的时候arr也必然会变的。这就是浅拷贝。那么我们下面就简单的说几种深度复制数组方式。
方式一：利用for循环把原数组的每一项都遍历，然后扔到新的数组中。

var arr = [12,5,8];
var arr2 = [];
for (var i = 0;i < arr.length;i++){
       arr2.push(arr[i]);
}
arr2.pop();
alert(arr);  //12 5 8复制代码

方式二：利用Array.from(原数组);

var arr = [12,5,8];
var arr2 = Array.from(arr);
arr2.pop();
console.log(arr2); //12 5
alert(arr);  //12 5 8复制代码

方式三：三个点

var arr = [12,5,8];
var arr = [...arr]
arr2.pop();
console.log(arr2); //12 5
alert(arr);  //12 5 8复制代码

说了这么多，我们现在就说下“三个点”的应用吧，我们知道函数的参数是一个集合(arguments)并不是一个真正的数组。那么我们怎么才能在这个arguments中加一项呢？？

function show(){
  //因为类数组对象，并不具备数组的那些方法。所以此会报错
  arguments.push(8);
  console.log(arguments);
}
show(12,5);复制代码

function show(...arr){
  arr.push(8);
  console.log(arr);
}
show(12,5); //12 5 8复制代码

转载于:https://juejin.im/post/5afff33e6fb9a07abc2a2f1a