欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

ES6下javascript解構(gòu)賦值常見用法總結(jié)

 更新時間:2022年01月30日 09:42:14   投稿:wdc  
這篇文章主要介紹了在ES6下javascript賦值常見用法總結(jié),需要的朋友可以參考下

Javascript解構(gòu)賦值出現(xiàn)的契機:

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

Javascript解構(gòu)賦值問題核心:

每次取值既要確定對象屬性名,還得重新定義一個變量占用多一行,代碼行數(shù)和重復的聲明a,使得代碼不夠簡潔,能否通過左邊變量名,匹配到右邊的屬性名從而取得對應的值,ES6解構(gòu)語法核心就基于這樣的模式匹配思想

上面的問題解構(gòu)方案:

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

很明顯看到,我們無需在右側(cè)顯式聲明取值屬性名,完全依據(jù)右邊結(jié)構(gòu)進行對應取值,非常優(yōu)雅

Javascript解構(gòu)賦值應用場景:

1.對象聲明解構(gòu)

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

2.對象賦值解構(gòu)

    let a, b
    let obj = {
        a: 1,
        b: 2
    }
    // 取值
    ({a, b} = obj)
    // 更常見的場景是變量c d被聲明到全局,這種情況在vue很常見,數(shù)據(jù)被提前聲明到data選項,數(shù)據(jù)訪問一般都是this.xxxdata,此時就很有用了
    ({a:c, b:d} = obj)

3.變量交換

    [x,y] = [y,x]

4.數(shù)組解構(gòu)

   let  [first,] = arr//獲取 
   let [first, ...rest] = arr//獲取第一個,以及剩余參數(shù)

5.函數(shù)對象實參解構(gòu)

    function buildAnimal({accessory = "", animal = "cat", color = 'rainbow', hairType = 'straight'} = {})
    {...}

更多關(guān)于ES6下的Javascript使用小技巧請查看下面的相關(guān)鏈接

相關(guān)文章

最新評論