您现在的位置:首页 >> 前端 >> 内容

变量的解构和赋值实例讲解

时间:2018/3/8 14:38:16 点击:

  核心提示:数组的解构赋值(按次序来比对)完全解构 不完全解构 默认值(es6的解构是===的)对象的解构赋值(按照位置来取值)也就是说,对象的解构赋值的内部机制,是先找到同名属性,然后再赋给对应的变量。真正被赋...

数组的解构赋值(按次序来比对)

完全解构 不完全解构 默认值(es6的解构是===的)

对象的解构赋值(按照位置来取值)

也就是说,对象的解构赋值的内部机制,是先找到同名属性,然后再赋给对应的变量。真正被赋值的是后者,而不是前者。

    let { foo: baz } = { foo: "aaa", bar: "bbb" };
    baz // "aaa"
    foo // error: foo is not defined

    const node = {
        loc: {
            start: {
            line: 1,
            column: 5
            }
        }
    };

    let { loc, loc: { start }, loc: { start: { line }} } = node;
    line // 1
    loc  // Object {start: Object}
    start // Object {line: 1, column: 5}

上面代码有三次解构赋值,分别是对loc、start、line三个属性的解构赋值。注意,最后一次对line属性的解构赋值之中,只有line是变量,loc和start都是模式,不是变量。

字符串的解构赋值

数值和布尔值的解构赋值(会优先被转换为对象)

函数参数的解构赋值

圆括号问题(以下三种不得使用圆括号)

变量声明语句 函数参数 赋值语句的模式

使用 

交换变量赋值

从函数返回多个值

函数参数的定义

提取JSON的值

函数参数的默认值

遍历Map结构(任何部署了 Iterator 接口的对象,都可以用for…of循环遍历。Map 结构原生支持 Iterator 接口,配合变量的解构赋值,获取键名和键值就非常方便。)

输入模块的指定方法

作者:网络 来源:shinemax的博