变量的解构赋值

本系列属于阮一峰老师所著的ECMAScript 6 入门学习笔记

---

之前为变量赋值只能直接指定值。ES6允许按照一定的模式，从数组和对象中提取值，对变量进行赋值，这被称为解构（Destructuring）。

数组的的解构赋值

// “模式匹配”，只要等号两边的模式相同，左边的变量就会被赋予对应的值。
let [a,b,c] = [1,2,3] // a=1 b=2 c=3
let [x,y,...z] = ['a']
x // 'a'
y // undefined
z // []

// 指定默认值：ES6内部使用严格相等运算符判断一个位置是否有值
let [foo=true] = []
foo // true
let [x=1] = [undefined] //一个数组成员不严格等于undefined，默认值不生效
x // 1
let [x=1] = [null]
x // null
// 默认值可以引用解构赋值的其他变量，但该变量必须已经声明
let [x=1,y=x] = [2] // x=2 y=2

对象的解构赋值

let {foo:baz} = {foo:'aaa',bar:'bbb'}
baz // 'aaa'
foo // error: foo is not defined
// foo是匹配的模式，baz才是变量，真正被赋值的是变量baz

// 指定默认值
var {x:y=3}={} // y=3
var {x:y=3}={x:5} // y=5

字符串的解构解析

字符串也可以解构赋值。这是因为此时，字符串被转换成了一个类似数组的对象。

const [a,b,c,d,e] = "hello";
a //"h"
b //"e"
c //"l"
d //"l"
e //"o"

// 类似数组的对象都有一个length属性，因此还可以对这个属性解构赋值
let {length : len} = 'hello';
len //5

数值和布尔值的解构赋值

解构赋值时，如果等号右边是数组和布尔值，则会先转为对象。

let {toString: s} = 123;
s === Number.prototype.toString //true

let {toString: s} = true;
s === Boolean.prototype.toString //true

函数参数的解构赋值

函数的参数也可以使用解构赋值

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