ES6解构赋值

解构赋值

解构赋值语法是一个 JavaScript 表达式，这使得可以将值从数组或属性从对象提取到不同的变量中

• 数组的结构赋值

• 对象的解构赋值

• 字符串的解构赋值

• 数值与布尔值的解构赋值

• 函数参数的解构赋值

数组的解构赋值

    const arr = [1, 2, 3, 4];
    let [a, b, c, d] = arr; // a=1, b=2, b=3, b=4

    const arr = ['a', 'b', ['c', 'd', ['e', 'f', 'g']]];
    const [a, b] = arr; // a='a', b='b'
    const [, , g] = ['e', 'f', 'g'] // g='g'
    const [, , [, , g]] = ['c', 'd', ['e', 'f', 'g']]; // g='g'

扩展运算符

    const arr1 = [1, 2, 3];
    const arr2 = ['a', 'b'];
    const arr3 = ['zz', 1];
    const arr4 = [...arr1, ...arr2, ...arr3]; // arr4 = [1, 2, 3, 'a', 'b', 'zz', 1]

    const arr = [1, 2, 3, 4];
    const [a, b, ...c] = arr; // c = [3, 4]

默认值

    const arr = [1, undefined, undefined];
    const [a, b = 2, c, d] = arr; // a=1, b=2, c=d=undefined

交换变量

    [a, b] = [b, a];

对象的解构赋值

对象的解构赋值与数组的解构赋值相似

等号左右两边都为对象结构 —— const{a, b} = {a:1, b:2}

左边的{}中为需要赋值的变量

右边为需要解构的对象

对象的解构赋值的主要用途

• 提取对象属性

• 使用对象传入乱序的函数参数

• 获取多个函数返回值