好程序员JavaScript 分享 ES6 相关知识， ES6 增加的语法

　　let&&const

　　[size=0.9em]let 与 [size=0.9em]var 的区别

　　let 变量名 = 变量值

　　使用let 创建变量和使用 var 创建变量的区别

　　1 、用 var 声明的变量会变量提升，用 let 声明的变量不会进行变量提升。

　　用let 创建变量

　　let xxx=xxx;

　　用let 创建函数

　　let xxx=function(){}

　　创建自执行函数

　　;(function(){

　　})();

　　2 、用 let 定义变量不允许在 [size=0.9em] 同一个作用域中重复声明一个变量 ( 只要当前作用域中有这个变量，不管是用 var 还是用 let 声明的，再用 let 声明的话会报错：不能重复声明一个变量 ) ，但是可以重复定义 ( 赋值 ) 。

　　let i=10;

　　let i=20;/ 会报错，

　　i=20; 重复赋值不会报错

　　3 、暂时性死区：在代码块内，使用 let 命令声明变量之前，该变量都是不可以使用的。

　　if (true) {

　　// TDZ 开始

　　tmp = 'abc'; // ReferenceError, 报错之后下面都不会输出

　　console.log(tmp); // ReferenceError ，报错之后下面都不会输出

　　let tmp; // TDZ 结束

　　console.log(tmp); // undefined

　　tmp = 123;

　　console.log(tmp); // 123

　　}

　　// 下面也会报错出现 TDZ

　　console.log(typeof x); // ReferenceError

　　let x;

　　// 作为比较如果一个变量根本没有被声明，使用 typeof 反而不会报错。

　　console.log(typeof x);// "undefined"

　　4 、 ES6 语法创建的变量 (let) 存在块级作用域

　　[ES5]

　　window 全局作用域

　　函数执行形成的私有作用域

　　[ES6]

　　除了有ES5 中的两个作用域， ES6 中新增加块级作用域 ( 我们可以把块级作用域理解为之前学习的私有作用域，存在私有作用域和作用域链的一些机制 )[size=0.9em]ES6 中把大部分用 { ｝包起来的都称之为块级作用域 ;

　　[size=0.9em]const

　　const 细节知识点和 let 类似

　　const 声明的常量只要声明就必须赋值，而且变量的值是一定的，不能被修改 ;

　　[size=0.9em] 注意：并不是变量的值不得改动，而是变量指向的那个内存地址不得改动。对于简单类型的数据 ( 数值、字符串、布尔值 ) ，值就保存在变量指向的那个内存地址，因此等同于常量。但对于复合类型的数据 ( 主要是对象和数组 ) ，变量指向的内存地址，保存的只是一个指针， const 只能保证这个指针是固定的，至于它指向的数据结构是不是可变的，就完全不能控制了。因此，将一个对象声明为常量必须非常小心。

　　[size=1em][size=1em]const 声明的变量也存在暂时性死区，即只能在声明的位置之后使用 ;

　　JS 中创建变量的方式汇总

　　[size=1em][size=1em][ES5]

　　· var ：创建变量

　　function ：创建函数

　　ES5 中创建变量或者函数：存在变量提升，重复声明等特征 ;

　　[size=1em][size=1em][ES6]

　　· let 创建变量

　　const ： ES6 中创建常量

　　ES6 中创建的变量或者常量：都不存在变量提升，也不可以重复声明，而且还存在块级作用域 ;

　　class ：创建一个类

　　import ：导入

　　ES6 中的解构赋值

　　[size=1em][size=1em] 按照原有值的结构，把原有值中的某一部分内容快速获取到 ( 快速赋值给一个变量 ) 。

　　数组的解构赋值

　　[size=1em][size=1em] 解构赋值本身是 ES6 的语法规范，使用什么关键字来声明这些变量是无所谓的，如果不用关键字来声明，那么就相当于给 window 添加的自定义属性 ;( 严格模式下必须使用关键字来声明，因为严格模式下不允许出现不用关键字声明的变量 ;) ，如果解构不到值，那么变量的值就是 undefined;

　　let [a,b,c]=[12,23,34];

　　var [d,e,f]=[35,41,63];

　　console.log(a,b,c)//12,23,34;

　　console.log(d,e,f)//35,41,63;

　　[q,w,e]=[1,2,3];// 相当于给 window 添加了三个属性 :q,w,e 值分别为 1 ， 2 ， 3;( 严格模式下会报错 )

　　[size=1em][size=1em] 多维数组的解构赋值，可以让我们快速的获取到需要的结果

　　let [a,b,c]=[[45,36],12,[23,43,[1,2[4,[8]]]]23,34];

　　console.log(a)//[45,36]

　　console.log(b)//12

　　console.log(c)//[23,43,[1,2,[4,[8]]]]

　　// 数组中不需要解构的值可用逗号 ( ， ) 空开，一个逗号代表空开一项

　　let [,,,A]=[12,23,45];

　　console.log(A)//undefined

　　let [,,B]=[12,23,45]

　　console.log(B)//45

　　[size=1em][size=1em] 在解构赋值中，支持扩展运算符即 [size=1em] … [size=1em], 只要用了扩展运算符，就相当于新生成了一个数组或者对象，如果解构不到值的话，新生成的数组或者对象为空，而不是 undefined ，但是扩展运算符必须放在末尾

　　let [a,...c]=[12,1,4,83,34];

　　console.log(a)//12

　　console.log(c)//[1,4,83,34];

　　let [a,...b,c]=[12,1,4,83,34];// 会报错，扩展运算符只能放在末尾 ;

　　对象的解构赋值

　　[size=1em][size=1em] 对象的简洁表示法：

　　const foo = 'bar';

　　const baz = {foo};

　　baz // {foo: "bar"}

　　// 等同于

　　const baz = {foo: foo};

　　[size=1em][size=1em] 对象的解构与数组有一个重要的不同。数组的元素是按次序排列的，变量的取值由它的位置决定 ; 而对象的属性没有次序，变量必须与属性同名，才能取到正确的值。

　　let { foo, bar } = { foo: "aaa", bar: "bbb" };

　　foo // "aaa"

　　bar // "bbb"

　　如果变量名与属性名不一致，必须写成下面这样。

　　let { foo: baz } = { foo: 'aaa', bar: 'bbb' };

　　baz // "aaa"

　　真正被赋值的是后者，而不是前者。

　　let obj = { first: 'hello', last: 'world' };

　　let { first: f, last: l } = obj;

　　f // 'hello'

　　l // 'world'

　　first//error: first is not defined

　　如果要将一个已经声明的变量用于解构赋值，必须非常小心。

　　// 错误的写法

　　let x;

　　{x} = {x: 1};// 会报错

　　因为 JavaScript 引擎会将 {x} 理解成一个代码块，从而发生语法错误。只有不将大括号写在行首，避免 JavaScript 将其解释为代码块，才能解决这个问题。

　　// 正确的写法

　　let x;

　　({x} = {x: 1});

放在圆括号当中就可以避免 JavaScript 将其解释为代码块。