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

ES6下javascript解構賦值常見用法總結

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

Javascript解構賦值出現(xiàn)的契機：

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

Javascript解構賦值問題核心：

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

上面的問題解構方案:

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

很明顯看到，我們無需在右側顯式聲明取值屬性名，完全依據右邊結構進行對應取值，非常優(yōu)雅

Javascript解構賦值應用場景：

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'} = {})
    {...}

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

相關文章

最新評論