美文网首页
ES6之解构赋值

ES6之解构赋值

作者: 树下老大爷的小老弟 | 来源:发表于2020-04-24 18:04 被阅读0次

    什么是解构赋值,能干啥,怎么用,简单得应用场景是啥,客官里面走,里面都有:

    咱们现在说说解构赋值得概念:从数组和对象中提取值,对变量进行赋值,这被称为解构赋值,解构:就是解析结构,如果你想解析得是数组,那么 = 号 左右都是数组,如果你解析得是对象,那么等号左右就都是对象。

    本质上,这种概念及写法就是属于:” 模式匹配 “,只要等号两边得 模式相同,左边得变量就会被赋予对应得值

    首先我们有一个数组或者对象,我要获取到其中某个值,没有解构赋值之前是这样的

    let  a = [1,2,3];   如果我要想获取到元素2怎么获取,简单:let b = a[1];  console.log( b ); 这不就把你想要得值拿到了嘛,现在这个数组比较短,而且如果你想拿更多得值,就要加更多得变量及赋值,哪为了方便就有了 ES6 中得 解构赋值。

    使用解构赋值拿到数组中得某个元素,接下来就是见证 简洁得时刻

    还是一样得需求,我想要上面数组中得 2 怎么获取, let [ , b, ,] = [ ...a]; console.log( b ); 结果拿到,也可以不使用扩展运算符,let [ , b , ,] = [1 , 2 ,3] ;这就是数组解构,但是这里请注意一点,解构有解构得规则,你要遵循人家得规则才能让你用,这个规则就是 数组得解构必须位置相等。

    解构数组注意

    上面介绍得是数组得解构赋值,下面来看看对象得解构赋值,对象也要按照人家定的规则来做,对象的规则就是对象解构时名字必须相同,哪什么意思,一起来看看

    首先有个对象   let obj = { name:"我是谁“,age: 24};  你如果要获取到姓名 不使用解构赋值 是这样的 obj.name 得到姓名,用了解构赋值 是这样得  let { name } = { ...obj } ; 获取到了 姓名。规则体现看下图

    解构对象注意

    这里还有就是 如果属性中出现了关键字怎么搞,如果正常获取肯定会语法报错,那么我们可以把获取到得属性名改一个别名,取代关键字:

    解构对象别名

    前文说过,解构赋值就是 模式匹配,只要你位置找得对,模式相同,就不会错。

    let [a, [b, c]] = [1, [2, 3]]; //这里是二维数组 ,两边得模式也匹配,哪你就会得到结果 console.log(a, b, c),不管是二维还是多维数组,只要左右 模式匹配,就是你想要得结果

    来一个简单得数组解构小应用:

        function fn (){

                return [ 1 , 2 , 3 ]

        }

        let [ a , b , c ] = fn();

        clg(a,b,c);

    在来一个关于JSON 数据得小应用:

        var jsonData = {

              id: 42,

              status: "OK",

              data: [867, 5309]

           };

        let { id, status, data: number } = jsonData;

        console.log(id, status, number);// 42, "OK", [867, 5309]

    以上就是对 解构赋值 知识得讲解和认知, 还有那句话:如有不对之处及不周之处请大佬们指出,也希望对一些人有所帮助,咱们下次再会!

    相关文章

      网友评论

          本文标题:ES6之解构赋值

          本文链接:https://www.haomeiwen.com/subject/kllfwhtx.html