zoukankan      html  css  js  c++  java
  • ES6解构赋值常见用法

    解构赋值出现的契机:

        let obj = {
            a: 1,
            b: 2
        }
        // 取值
        let a = obj.a
        let b = obj.b
    

    问题核心:

    每次取值既要确定对象属性名,还得重新定义一个变量占用多一行,代码行数和重复的声明a,使得代码不够简洁,能否通过左边变量名,匹配到右边的属性名从而取得对应的值,ES6解构语法核心就基于这样的模式匹配思想
    

    上面的问题解构方案:

        let obj = {
            a: 1,
            b: 2
        }
        // 取值
        let {a, b} = obj
        // a=1 b=2
    
    很明显看到,我们无需在右侧显式声明取值属性名,完全依据右边结构进行对应取值,非常优雅
    

    应用场景:

    1.对象声明解构

        let obj = {
            a: 1,
            b: 2
        }
        // 取值
        let {a, b} = obj
        // a=1 b=2
    

    2.对象赋值解构

        let a, b
        let obj = {
            a: 1,
            b: 2
        }
        // 取值
        ({a, b} = obj)
        // 更常见的场景是变量c d被声明到全局,这种情况在vue很常见,数据被提前声明到data选项,数据访问一般都是this.xxxdata,此时就很有用了
        ({a:c, b:d} = obj)
    

    3.变量交换

        [x,y] = [y,x]
    

    4.数组解构

       let  [first,] = arr//获取 
       let [first, ...rest] = arr//获取第一个,以及剩余参数
    

    5.函数对象实参解构

        function buildAnimal({accessory = "", animal = "cat", color = 'rainbow', hairType = 'straight'} = {})
        {...}
    
  • 相关阅读:
    UVa 116 单向TSP(多段图最短路)
    POJ 1328 Radar Installation(贪心)
    POJ 1260 Pearls
    POJ 1836 Alignment
    POJ 3267 The Cow Lexicon
    UVa 1620 懒惰的苏珊(逆序数)
    POJ 1018 Communication System(DP)
    UVa 1347 旅行
    UVa 437 巴比伦塔
    UVa 1025 城市里的间谍
  • 原文地址:https://www.cnblogs.com/sefaultment/p/9954654.html
Copyright © 2011-2022 走看看