ES6解构赋值详解

解构赋值

解构赋值语法是一种 Javascript 表达式。通过解构赋值, 可以将属性/值从对象/数组中取出,赋值给其他变量。

1、把数组中的值顺序赋值给不同变量

可以看出，变量赋值的顺序是和数组顺序一致的，从下标为0开始

let [a, b] = [10, 20];
console.log(a); // 10
console.log(b); // 20

// 长度大于变量数量时，结果不会受到影响
let [a, b] = [10, 20, 30];
console.log(a); // 10
console.log(b); // 20

2、把对象中的属性同时赋值给与变量名相同的变量

方法与数组赋值很相似，仅仅是把数组变成了对象
注意：对象的顺序不会影响赋值的顺序，对象结构赋值对应的是相同的key属性

let { a, b } = { a: 10, b: 20 };
console.log(a); // 10
console.log(b); // 20

// 对象的顺序不会影响赋值的顺序，对象结构赋值对应的是相同的key属性
let { a, b } = { c: 10, b: 20, a: 30 };
console.log(a); // 30
console.log(b); // 20

3、变换变量

可以通过解构赋值实现变量的快速转变

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

4、忽略某些值

对于某些不需要的值，也可以跳过进行赋值

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

把数组前后分开赋值，后面变量赋值成数组

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

暂时写到这，后面有想到新的再补充。