ES6-变量解构赋值啦

变量的解构赋值

解构指ES6允许按照一定模式从数组和对象中提取值，然后对变量进行赋值。

数组的解构赋值

let [a, b, c] = [1, 2, 3]

• 解构不成功的话，变量的值就等于undefined

  let [bar, foo] = [1] //foo是undefined
  

• 不完全解构也可以成功

  let [x, y] = [1, 2, 3] // x = 1, y = 2
  

• 如果等号右边不是数组（可遍历结构），就会报错

  let [foo] = 1
  let [foo] = false
  let [foo] = NaN 
  

• ES6内部使用严格相等运算符（===）判断一个位置是否有值，所以，如果一个数组成员不严格等于undefined，默认值是不会生效的

  let [x = 1] = [null] //x null
  

• 默认值可以引用解构赋值的其他变量，但该变量必须已经声明

  let [ x = y, y = 1] = [] //ReferenceError
  

对象的解构赋值

• 对象的解构与数组有一个重要的不同。数组元素是按次序匹配的，对象的属性没有次序，变量必须与属性同名才能取到正确的值。

  var { bar, foo} = { foo: 'aaa', bar: 'bbb' }
  

• 如果变量名与属性名不一致,则写成下面这样，foo是模式，baz是变量，被赋值的是变量

  var { foo: baz } = { foo: 'aaa'}
  

• 实际上说明，对象的解构赋值的完整写法如下：

  内部机制是先找到同名属性，然后再赋值给对应的变量，真正被赋值的是后者，而不是前者

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

• 可以使用默认值，默认值生效条件与数组一样，对象的属性值严格等于undefined

• 如果解构失败，与数组一样，变量的值等于undefined

• 嵌套模式中，子对象所在的父属性不存在的话，就会报错

字符串的解构赋值

• 字符串被解构赋值时会转换成一个类似数组的对象。

  const [a, b, c, d, e] = 'hello'
  

• 类似数组的对象都有一个length属性，所以可以对这个属性解构赋值

  let { length: len} = 'hello'  //len 5
  

数值和布尔值的解构赋值

等号右边是数值或者布尔值，要先转为对象，不能转为对象的（undefined、null）就会报错。

函数参数的解构赋值

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

函数add的参数表面上是一个数组，但是在传入参数的时候就已经被解构成变量x和y。

函数参数的解构也可以使用默认值，一种是为变量指定默认值，一种是为参数指定默认值。

用途

• 交换变量的值
• 从函数返回多个值
• 函数参数的定义
• 提取JSON数据
• 指定函数参数的默认值
• 遍历map结构
• 输入模块的指定方法

阅读《ES6标准入门（第3版）》读书笔记