es6——解构

    ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构,解构的本质属于“模式匹配”,只要等号两边的模式相同,左边的变量就会被赋予对应的值。如果解构不成功,变量的值就等于undefined。

1.数组解构

等号左边的变量放到中括号内部,匹配右侧数组中的元素。

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

    console.log(a,b,c);

  2.let [a,b,c,d,e]=[1,2,3,[4,5],6];

    console.log(a,b,c,d,e);

  3.不完全解构

    let [a,b,c,[d],e]=[1,2,3,[4,5,6],7];

    console.log(a,b,c,d,e);

    4.集合解构 ...扩展运算符

    let [a,...b]=[1,2,3,4,5];

    console.log(a,b);

    5.默认值解构(当匹配值严格等于undefined时,默认值生效)

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

    console.log(a,b,c);

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

    console.log(a,b,c);

    6.默认值也可以是函数

    function(){console.log('hello')}

    let [a=test()]=[1];

    console.log(a);

    let [a=test()]=[];

    console.log(a);

    

    7.let arr=[1,2,3,4];

     let [...a]=arr;

     console.log(a===arr);//false

2.对象解构

    等号左边的变量放到大括号内部,匹配右侧对象中的元素。对象的属性没有次序,变量必须与属性同名,才能取到正确的值

    1.let {foo,bar}={foo:'hello',bar:"world"};

    console.log(foo,bar);

    2.如果变量名和属性名不一致,需要重命名

    let {foo:baz}={foo:"hello",bar:"world"};   baz:hello

    

    3.对象的解构赋值是下面形式的简写 前面属性名后边变量名

    let {foo:foo,bar:bar}={foo:'hello',bar:"world"};

    4.嵌套结构

    let obj={p:['hello',{y:"world"}]};

    let {p:[a,{y:b}]}=obj;

    console.log(a,b);hello world

    

    5.默认值结构

    let {x:y=3}={};

    console.log(y);3

    经典面试题:

    const [a, b, c, ...d] = [1, 2, 3, 11, 999];

    const { e, f,f1, g, ...h } = { f: 4, g: 5, i: 6, j: 7 };

    console.log(a, b, c, d, e, f1, g, h);

//1 2 3 [ 11, 999 ] undefined undefined 5 { i: 6, j: 7 }

3.字符串解构

    1.可以使用对象解构或者是数组解构,使用数组结构可以获取指定字符;使用对象结构可以获取实例属性方法;

    let [a,b,c]='hello';

    console.log(a,b,c);h e l

    

    2.也可以将string字符串转换为数组

    let [...arr]='hello';

    console.log(arr)

    

    3.使用对象解构

      let {toString,valueOf,length}='hello';//相当于把‘hello’当成String基本包装器类型

     console.log(toString,valueOf,length)

4.数值解构  可以获取到数值包装器构造函数原型中指定的方法。

    let {toString,valueOf}=10;

    console.log(toString,valueOf)

5.布尔值解构

    let {toString,valueOf}=true;

    console.log(toString,valueOf)

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值