JS-数组解构赋值

数组解构赋值

解构赋值是ES6中新增的一种赋值方式

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

数组解构赋值的注意点

• 等号左边的格式必须和等号右边的格式一模一样, 才能完全解构

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

• 左边个数可以小于右边个数(左 < 右) 匹配不到的会剩余

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

• 如果右边的个数和左边的个数不一样, 那么我们可以给左边指定默认值

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

• 左边个数可以大于右边个数 (左 > 右) , 匹配不到项的值为undefined

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

• 左边个数可以小于右边个数, 那么如果设置默认值会被覆盖

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

扩展运算符

ES6中新增的扩展运算符: …
在数组的解构赋值中, 还可以使用ES6中新增的扩展运算符来打包剩余的数据, 如果使用了扩展运算符, 那么扩展运算符只能写在最后

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


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