es6-解构赋值

数组解构赋值

• 基本用法

let [a, b, c] = [1, 2, 3];
a // 1;
b // 2;
c // 3;
-----------------------------------
let [a, b, c] = [1, [2, 3], 4];
a // 1;
b // [2, 3];
c // 4;
-----------------------------------
let [a, [b], c] = [1, [2, 3], 4];
a // 1;
b // 2;
c // 4;
-----------------------------------
let [a, ...b] = [1, 2, 3, 4];
a // 1;
b // [2, 3, 4];

• 默认值

let [a, b = 5] = [1];
a // 1;
b // 5;
-----------------------------------
let [a, b = 5] = [1, 2];
a // 1;
b // 2;
-----------------------------------
let [a, b = 5] = [1, undefined];
a // 1;
b // 5; undefined不生效
-----------------------------------
let [a, b = 5] = [1, null];
a // 1;
b // null;

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

let [x = 1 , y = x] = [];			//x=l ; y=l 
let [x = 1, y = x] = [2];			//x=2 ; y=2 
let [ x = 1 , y = x] = [ 1 , 2];	//x=l; y=2 
let [ x = y , y = l] = [];			//ReferenceError y没有声明

对象的解构赋值

对象解构赋值与数组不同，数组根据位置进行赋值，而对象属性没有顺序，变量名必须和属性名相同才能赋值。

let {name, age} = {age: 18, name: 'uzi'};
name // uzi;
age // 18;
-----------------------------------
// 变量名没有相同属性名，等于undefined
let {profession} = {age: 18, name: 'uzi'};
profession // undefined;
-----------------------------------
// 变量名和属性名不同可以写成下面这样
let {play: profession} = {age: 18, name: 'uzi', play: 'ADC'};
profession // ADC;

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

• 嵌套

let people = {
	name: 'uzi',
	playHero: ['小炮', {best: 'vn'}]
};
let {name, playHero:[hero1, {best}]} = people;
name // uzi;
best // vn;
playHero // playHero is not defined。playHero是模式不是变量，不会被赋值
let {name, playHero} = people;
name // uzi;
playHero // ["小炮", {best: "vn"}]
// playHero是变量，会被赋值

字待串的解构赋值

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

let [a, b, c] = 'uzi';
a // u;
b // z;
c // i;
-----------------------------------
//类似数组的对象都有一个 length 属性 因此还可以对这个属性进行解构赋值
let {length: len} = 'uzi';
len // 3;

数值和布尔值的解构赋值

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

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