ES6变量的解构赋值

一、数组的解构赋值
var [a,b,c] = [1,2,3]; 左边是变量,右边是值,根据数据结构一一对应

1、只要等号两边的模式相同,左边的变量就会被赋予右边对应的值,必须模式相同
2、如果等号右边的不是数组,确切的说不是可遍历的数组,那么将会报错
3、解构赋值不仅适用于var 命令,也适用于 let / const 命令   
4、只要是可遍历的数据,都可以使用数组的解构赋值:
    let [a,b,c] = new set(["1","2","3"]);
5、解构赋值同样允许指定默认值    let [a = "1",b] = [2];    //a=1  b=2  
6、默认值可以引用其它变量,但是该变量必须已经声明

二、对象的解构赋值
var {a,b} = {a: “1”, b:”2”} 左边是变量名,右边是给属性赋值的对象列表,变量名必须与属性性名一致,才能取到正确的值,与次序完全没关系。

1、对象的解构赋值与数组有一个重要的不同,数组元素在解构赋值时,是按照次序排列赋值的,变量的值由位置决定;而对象没有次序,变量必须与属性性同名,才能取到正确的值    
2、如果变量名与属性名不一致,必须把不一致的属性作为属性值赋值给有值的属性:

let {a: d} = {a:"1",b:"2"};
d //1


3、对象的解构赋值的机制是:先找到同名属性,然后再赋值对应的变量。真正被赋值的是后者,而不是前者。上面的代码中,真正被赋值的是 d,而不是 a
        let {a: d} = {a:"1",b:"2"};d //1
        如上,只有d被申明并且被赋值为1,a并没有被声明console.log(a)会报not defined
4、let 在声明变量之后,不可以再重复声明,如果想要重复声明,必须将再次声明的变量与赋值语句用圆括号括起来,否则会报错。使用圆括号的原因是,解析器会将起首的大括号,理解成一个代码块,而不是赋值语句
    复制代码

    let a;
    ({a} = {a:"1"});  //OK

    let b:
    ({c:b} = {c:"2"});     //OK

    let c:
    {c} = {c: 1}               //error
    ({c} = {c:1});             //OK


    复制代码


5、对象的赋值表达式,也主是赋值语句,如果放在圆括号里,在大部分场景下都可以执行,如果不放在圆括号里,严格模式下是会报错的。
6、对象的解构赋值同样也可以指定默认值:  let {a=""3} = {}
7、对象的解构赋值,可以很方便的将现有对象的方法,赋值到某个变量
    复制代码

    function logo(){...}
    function setData(){...}
    function list(){...}

    可以很方便的将上面的三个方法,赋值给一个变量:

    let {logo,setData,list} = Match;

    复制代码



8、字符串的解构赋值  const [h,e,l,l,o] = 'hello'  字符的解构赋值是把字符串转换成了类似数组的对象,它有length属性值,只是类数组,数组的方法不可以用在类数组上
9、数值和布尔值的解构赋值:如果等号右边的是数值或布尔值,要先转换为对象再赋值。解构赋值的规则是,只要等号右边的不是对象,就先将其转换为对象(undefined与null无法转为对象,所以无法对它们进行解构赋值)
10、函数的参数也可以进行解构赋值,函数的参数也可以使用默认值

怎么让解析器判断,一个语句,到底是模式还是表达式,没有办法从一开始就知道,必须解析到等号才能知道。ES6的规则是:只要有可能导致解构歧义,就不要在模式中放置圆括号。建议,只要有可能,就不要在模式中使用圆括号。

转载至:https://www.cnblogs.com/baiyygynui/p/5702488.html
可参考:https://blog.csdn.net/ChauncyWu/article/details/72889337

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值