zoukankan      html  css  js  c++  java
  • ES6入门学习(part3)解构赋值

    接part2 的声明与表达式。part2 学习了 声明变量使用的 let conts 的基本用法以及使用注意事项

    一、声明与表达式

    2、解构赋值

    2.1定义

    结构赋值是对赋值运算符的一种拓展。解构赋值表达式由两部分组成:(1)解构源。解构赋值表达式的右边。(2)解构目标。结构赋值表达式的左边

    2.2数组模型的解构(Array)

    2.2.1 数组模型解构的特点大致分为4种:

    (1)解构源(array)和解构目标(array) 满足  对应位置、对应赋值

    (1.1)基本解构   let [a, b, c] = [1, 2, 3];

    (2)解构源(array)和解构目标(array) 满足  对应的模式匹配

    (2.1)可嵌套、可忽略解构   let [a, [[b,c], d]] = [1, [[2], 3]];

    (2.2)不完全解构   let [a = 1, b] = [];

    (2.3)剩余运算符   let [a, ...b] = [1, 2, 3];

    (3)解构源(string)和解构目标(array)。此时解构目标要满足可以遍历

    (3.1)字符串解构  let [a, b, c, d, e] = 'hello';

    (4)解构默认值 

    (4.1)undefined 不等于 null

    (4.2)变量匹配结果如果为undefined,触发默认值。 let [a = 2] = [undefined] || []; // a = 2

    (4.3)let [a = 3, b = a] = [1]; // a = 1, b = 1

    (4.4)let [a = 3, b = a] = [1, 2]; // a = 1, b = 2

    2.3对象模型的解构(Object)

    2.3.1 数组模型解构的特点大致分为4种:

    (1)解构源(object)和解构目标(objext) 满足  对应位置、对应赋值

    (1.1)基本解构   let { foo, bar } = { foo: 'aaa', bar: 'bbb' };//foo = "aaa"   bar = "bbb"

    (2)解构源(object)和解构目标(object) 满足  对应的模式匹配

    (2.1)可嵌套、可忽略解构、不完全解构   let {p: [x, { y },z] }{p: ['hello', {y: 'world'}] };//x = "hello"  y = "world"  z = undefined

    (2.2)剩余运算符   let {a, b, ...rest} = {a: 10, b: 20, c: 30, d: 40};

    (3)解构默认值 

    (3.1)let {a = 10, b = 5} = {a: 3}; // a = 3  b = 5

    (3.2)let {a: aa = 10, b: bb = 5} = {a: 3};  // aa = 3  bb = 5

  • 相关阅读:
    mysql查看每张表的空间使用情况
    下一步开发的技术点
    技术体系需要继续探索的东西
    架构体系需要进一步研究探索的V2路线图
    串行写队列的MYSQL大文本参数
    Node.js 数据存储方式的选择
    Node.js npm 详解
    Node入门
    Node.js知识点学习
    为什么应使用 Node.js
  • 原文地址:https://www.cnblogs.com/Ella2018/p/10974960.html
Copyright © 2011-2022 走看看