小王的学习笔记（六）——var、let、const、解构

let——为js新增块级作用域

let声明的变量只在当前代码块内有效
存在暂时性死区（避免变量的全局污染）
不存在变量提升
不允许重复声明

const

const 声明一个只读的常量，不允许重新赋值
声明的同时必须初始化
不存在变量提升
只在当前代码块内有效
存在暂时性死区

var let const的区别

1. var全局声明变量，let，const声明的变量只在let，const所在代码块内有效。
2. var存在变量提升，即变量可以在声明之前使用，值为undefined，let声明的变量必须在声明后才可以使用，否则报错。
3. var可以重复定义一个变量，后面覆盖前面的，而let不允许重复定义一个变量，否则报错。且let，const存在暂时性死区(TDZ)，也就是let，const声明变量之前，该变量不可用，即Let，const封闭作用域。

解构

从数组和对象中提取值赋值给变量

1. 完全解构，变量和值一一匹配

    let [a,b,c] = [1,2,3];
    console.log(a,b,c);//1 2 3
   

2. 不完全解构

    let [a,b,c] = [1,2,3,4,5];
    console.log(a,b,c);//1 2 3   
   

3. 解构不成功：只有一部分被赋值，剩下的是undefined

   let [a,b,c] = [1,2] 
   console.log(a,b,c);//1 2 undefined
   

数组的解构赋值

1. 不完全解构
2. 集合解构

   let [a,b,...c] = [1,2,3,4,5]// ...会自动生成一个数组
   	console.log(c); //[3,4,5]
   

3. 默认值
   在解构前设置默认值，变量匹配到值为undefined时默认值生效，默认值也可以为一个方法。

   let [a,b,c=1,d=2] = [4,2] //a,b,c,d为4 2 1 2
   

对象解构

1. 对象解构需要根据属性名一 一对应，没有顺序，变量必须与属性同名才能取到正确的值：

   也就是说
   let { foo: foo, bar: bar } = { foo: "aaa", bar: "bbb" };
   与
   let { foo, bar } = { foo: “aaa”, bar: “bbb” };
   是一样的
   结果都为// foo = "aaa”; bar = "bbb”
   

   如果变量名与属性名不一致，就必须这样写：

   var { foo: baz } = { foo: 'aaa'}; 	//baz = "aaa”
   

2. 嵌套解构

   let obj = { p: [ 'Hello', { y: 'World' } ] }; 
   let { p: [x,y] } = obj;
   console.log(x,y);//Hello { y: 'World' }
   --------------------------------------------
   let obj = { p: [ 'Hello', { y: 'World' } ] }; 
   let { p: [x, { y }] } = obj; 	
   console.log(x,y)//Hello World
   

3. 默认值
   匹配到undefined时默认值生效

字符串解构

1. 字符串解构时会被先转换为类数组对象（字符串拥有迭代器）

   let {a,b,...c} = 'hello'
   console.log(c);
   //{ '0': 'h', '1': 'e', '2': 'l', '3': 'l', '4': 'o' }
   let [a,b,...c] = 'hello'
   console.log(c);//[ 'l', 'l', 'o' ]
   

2. 对字符串属性的解构

   let {length:len}='hello'
   console.log(len)//5
   

数值和布尔值

解构赋值的规则是，只要等号右边的值不是对象或数组，就先将其转为对象。由于undefined和null无法转为对象，所以对它们进行解构赋值，都会报错。

函数的解构

function add([x, y]){ return x + y; }
add([1, 2]);

常见用途：

交换变量的值 
let x = 1; let y = 2; [x, y] = [y, x]; 
从函数返回多个值
function example() { return [1, 2, 3]; } 
let [a, b, c] = example();
函数参数的定义
function f([x, y, z]) { ... } f([1, 2, 3]);
提取JSON数据 
let jsonData = { id: 42, status: "OK", data: [867, 5309] }; 
let { id, status, data: number } = jsonData; 
输入模块的指定方法 
const { SourceMapConsumer, SourceNode } = require("source-map");