美文网首页
变量的解构赋值

变量的解构赋值

作者: 男朋友Ang | 来源:发表于2018-12-27 16:40 被阅读0次

    1.数组的解构赋值


    基本用法

    ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被成为解构(Destructuring)。

    以前,为变量赋值,只能直接指定值。

    let a = 1;
    let b = 2;
    let c = 3;
    

    ES6允许写成这样

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

    上面代码表示,可以从数组中提取值,按照对应位置,对变量赋值。

    本质上,这种写法属于“模式匹配”,只要等号两边的模式相同,左边的变量就会被赋予对应的值。下面是一些使用嵌套数组进行解构的例子。

    let [foo, [[bar],baz]] = [1,[[2], 3]];
    foo // 1
    bar // 2
    baz // 3
    
    let [ , , third] = ["foo", "bar", "baz"];
    
    let [x, , y] = [1, 2, 3];
    x // 1 
    y // 3
    
    let [head, ...tail] = [1, 2, 3, 4];
    head // 1
    tail // [2, 3, 4]
    
    let [x, y, ...z] = ['a'];
    x // "a"
    y // undefined
    z // []
    

    如果解构不成功,变量的值就等于undefined

    let [foo] = [];
    let [bar, foo] = [1];  
    

    以上两种情况都属于解构不成功,foo的值都会等于undefined

    另一种情况是不完全解构,即等号左边的模式,只匹配一部分的等号右边的数组。这种情况下,解构依然可以成功。

    let [x, y] = [1, 2, 3];
    x // 1
    y // 2
    
    let [a, [b], d] = [1, [2, 3], 4];
    a // 1
    b // 2
    d // 4
    

    上面两个例子,都属于不完全解构,但是可以成功。

    如果等号的右边不是数组(或者严格地说,不是可遍历的结构,参见《Iterator》一章),那么将会报错。

    // 报错
    let [foo] = 1;
    let [foo] = false;
    let [foo] = NaN;
    let [foo] = undefined;
    let [foo] = null;
    let [foo] = {};
    

    上面的语句都会报错,因为等号右边的值,要么转为对象以后不具备 Iterator 接口(前五个表达式),要么本身就不具备 Iterator 接口(最后一个表达式)。

    对于 Set 结构,也可以使用数组的解构赋值。

    let [x, y, z] = new Set(['a', 'b', 'c']);
    x // "a"
    

    事实上,只要某种数据结构具有 Iterator 接口,都可以采用数组形式的解构赋值。

    相关文章

      网友评论

          本文标题:变量的解构赋值

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