美文网首页
[ES6] 解构赋值

[ES6] 解构赋值

作者: EmilioWeng | 来源:发表于2019-08-13 23:28 被阅读0次

    解构(Destructuring)

    ES6 允许从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring)。

    let [a, b, c] = [1, 2, 3];
    

    本质上,这种写法属于“模式匹配”,只要等号两边的模式相同或者可以匹配上,左边的变量就会被赋予对应右边的值。

    let [first, [[second], third]] = [1, [[2], 3]];
    first // 1
    second // 2
    third // 3
    
    let [ , , third] = ["first", "second", "third"];
    third // "third"
    
    let [x, , y] = [1, 2, 3];
    x // 1
    y // 3
    
    let [head, ...tail] = [1, 2, 3, 4];
    head // 1
    tail // [2, 3, 4]
    

    如果变量匹配不上导致解构不成功,变量的值就等于undefined。一般解构不成功是因为等号右边的值无法匹配上等号左边的变量。
    要是等号左边的变量只能匹配到部分等号右边的值,称为不完全解构

    let [foo] = []; //undefined
    let [first, foo] = [1]; //foo is undefined
    

    针对数组的解构,如果等号右边的值是不可遍历的,则解构时会报错。

    // 以下均会报错
    let [foo] = 1;
    let [foo] = false;
    let [foo] = undefined;
    let [foo] = null;
    let [foo] = {};
    

    解构不仅可以用在数组上,也可以用在对象中。对象的解构与数组不一样的地方在于,数组解构时严格按照顺序进行匹配,而对象则需要按照同名的属性进行匹配。

    let { first, second } = { first: '111', second: '222' };
    first // "111"
    second // "222"
    

    需要注意的是,因为数组本质是特殊的对象,因此可以对数组进行对象属性的解构。

    let arr = [1, 2, 3];
    let {0 : first, 2 : third} = arr;
    first // 1
    third // 3
    

    相关文章

      网友评论

          本文标题:[ES6] 解构赋值

          本文链接:https://www.haomeiwen.com/subject/kfmijctx.html