zoukankan      html  css  js  c++  java
  • ES6--解构赋值

    注意点:

    1、等号左右两边结构必须一样

    let [a,b] = {a: 1, b: 2}
    
    //TypeError: {(intermediate value)(intermediate value)} is not iterable

    2、右边结构语法必须正确。{1, 2}既不是对象,也不是数组,语法不正确

    let {a,b} = {1, 2}
    
    // SyntaxError: Unexpected token ,

    3、声明与赋值不能分开

    let [a, b]          //声明
    [a, b] = [1, 2]     //赋值
    // SyntaxError: Missing initializer in destructuring declaration(解构声明缺乏初始化)

    可以这样先声明后赋值

    let a, b
    [a, b] = [1, 2]

    数组的解构赋值

    剩余模式

    let [a, b, ...rest] = [10, 20, 30, 40, 50]
    console.log(a)  //10
    console.log(b)  //20
    console.log(rest)   //[30,40,50]

    前后数量不同

    变量多时,值为undefined

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

    变量少时,忽略后面的值

    let [a, b] = [1, 2, 3, 4, 5]
    console.log(a); // 1
    console.log(b); // 2
    //后面的值忽略

    设置默认值

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

    交换变量

    let a = 3, b = 1  //这里的分号不加会报错,ReferenceError: Cannot access 'b' before initialization
    [a, b] = [b, a]
    console.log(a)  //1
    console.log(b)  //3

    对象的解构赋值

    基本赋值

    let { a, b } = { a: 1, b: 2 }
    console.log(a)  //1
    console.log(b)  //2

    先声明后赋值

    let a, b;
    ({ a, b } = { a: 1, b: 2 })

    这里的(...)必须加

    给新的变量名赋值

    let { a: c, b: d } = { a: 1, b: 2 }
    console.log(c)  //1
    console.log(d)  //2

    默认值

    与数组解构类似

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

    给新的变量命名并提供默认值

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

    好的应用1

    好的应用2

    剩余模式

    let { a, b, ...rest } = { a: 10, b: 20, c: 30, d: 40 }
    console.log(rest)   //{c: 30, d: 40}

    解构对象会查找原型链

    var obj = { a: 1 };
    Object.prototype.b = 2;
    // 或者
    // obj.__proto__.b = 2
    const { a, b } = obj;
    console.log(a)  //1
    console.log(b)  //2
  • 相关阅读:
    python3 driver chrome This version of ChromeDriver only supports Chrome version 89
    centos7 conda 安装 tensorflow
    python3 selenium Google浏览器 自动登录
    Fiddler Script
    深夜看了张一鸣的微博,让我越想越后怕(转载)
    OpenCV相关库
    .NET 面试题汇总(带答案)
    Java面试题
    定制化知识图谱 项目介绍
    关于《社会主义经济理论》若干问题的思考《九》
  • 原文地址:https://www.cnblogs.com/lianglanlan/p/9818547.html
Copyright © 2011-2022 走看看