成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

es6基礎(chǔ)0x008：解構(gòu)賦值

xiaoxiaozi / 1473人閱讀

摘要：概述實(shí)不相瞞，解構(gòu)賦值非常叼，特別是和其他一起使用的時(shí)候，那如何簡單的說解構(gòu)賦值呢，打個(gè)比方解構(gòu)賦值就是一個(gè)硬幣拆分機(jī)，將所有的一毛五毛一塊硬幣投入硬幣拆分機(jī)，他就自動(dòng)將所有的硬幣分好了，拿出你要的就行了解構(gòu)數(shù)組可以從一個(gè)數(shù)組從取出你想要的

0x000 概述

實(shí)不相瞞，解構(gòu)賦值非常叼，特別是和其他es6一起使用的時(shí)候，那如何簡單的說解構(gòu)賦值呢，打個(gè)比方：解構(gòu)賦值就是一個(gè)硬幣拆分機(jī)，將所有的一毛、五毛、一塊硬幣投入硬幣拆分機(jī)，他就自動(dòng)將所有的硬幣分好了，拿出你要的就行了！

0x001 解構(gòu)數(shù)組

可以從一個(gè)數(shù)組從取出你想要的一個(gè)數(shù)據(jù)或者一組數(shù)據(jù)

普通

let [a, b, c]=[1,2,3]
console.log(a) // 1
console.log(b) // 2
console.log(c) // 3

和剩余參數(shù)一起用

let [a, b, ...c]=[1,2,3,4,5]
console.log(a) // 1
console.log(b) // 2
console.log(c) // [3,4,5]

省略一些參數(shù)

let [a, , ...c]=[1,2,3,4,5]
console.log(a) // 1
console.log(c) // [3,4,5]

參數(shù)不夠

let [a, b, c]=[1,2]
console.log(a) // 1
console.log(b) // 2
console.log(c) // undefined

參數(shù)不夠又不想要undefined，可以使用默認(rèn)參數(shù)

let [a, b, c=3]=[1,2]
console.log(a) // 1
console.log(b) // 2
console.log(c) // 3

對已有變量解構(gòu)賦值

let a, b
[a, b]=[1,2]
console.log(a, b)// 1,2

0x002 有趣的數(shù)組解構(gòu)栗子

交換兩個(gè)變量

let a=1,b=2
[a, b]=[b, a]
console.log(a) // 2
console.log(b) // 1

獲取一個(gè)正則匹配的結(jié)果

let [,match]="hello world".match(/h(e)/) 
// 匹配的結(jié)果是 ["he", "e", index: 0, input: "hello world", groups: undefined]

console.log(match) // "e"

0x003 解構(gòu)對象

可以從對象中取出對象的一個(gè)屬性值，或者一個(gè)子對象

普通

let {a, b}={a:1,b:2}
console.log(a) // 1
console.log(b) // 2

剩余屬性

let {a,...b}={a:1,b:2,c:3}
console.log(a) // 1
console.log(b) // {b:2,c:3}

屬性不夠

let {a, b, c}={a:1,b:2}
console.log(a) // 1
console.log(b) // 2
console.log(c) // undefined

屬性不夠可以使用默認(rèn)參數(shù)

let {a, b, c=3}={a:1,b:2}
console.log(a) // 1
console.log(b) // 2
console.log(c) // 3

給新的變量賦值

let {a:aa, b:bb}={a:1,b:2}
console.log(aa) // 1
console.log(bb) // 2

給新的變量賦值并提供默認(rèn)值

let {a:aa, b:bb, c:cc=3}={a:1,b:2}
console.log(aa) // 1
console.log(bb) // 2
console.log(cc) // 3

很深的對象也可以解構(gòu)

let {name, books:[book]}={name:"haha",books:["book1"]}
console.log(name) // "haha"
console.log(book) // "book1"

迭代中的解構(gòu)

for(let {name} of [{name:1},{name:2}]){
    console.log(name) // 1 2
}

解構(gòu)函數(shù)形參

let register({name, pwd}){
    console.log(name, pwd)
}
register({name:"1",pwd:"2"}) //1,2

給已有變量賦值，比較特殊

let a,b
({a, b}={a:1,b:2}) // 需要提升優(yōu)先級，否則 {a, b} 會(huì)被解析成代碼塊
console.log(a, b)// 1, 2

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/99226.html

相關(guān)文章

  • JavaScript基礎(chǔ)之ES6對象解構(gòu)賦值

    摘要：具體的分析暫時(shí)不討論解決的方式很簡單，把上面的代碼塊變成一段表達(dá)式就小明總結(jié)解構(gòu)賦值是提供一個(gè)十分方便的表達(dá)式。的解構(gòu)賦值小明的對象賦值這里可以被賦予初始值小明對象的屬性不存在能夠賦值給多個(gè)變量 對象解構(gòu)賦值 ES6 允許按照一定模式，從數(shù)組和對象中提取值，對變量進(jìn)行賦值，這被稱為解構(gòu)(Destructuring)。 --- 阮一峰《ECMAScript...

    sutaking 評論0 收藏0

  • ES6基礎(chǔ)知識(shí)01(let,const,解構(gòu)賦值)

    摘要：聲明的變量不得改變值，這意味著，一旦聲明變量，就必須立即初始化，不能留到以后賦值。解構(gòu)賦值允許按照一定模式，從數(shù)組和對象中提取值，對變量進(jìn)行賦值，這被稱為解構(gòu)。對象的解構(gòu)賦值對象的屬性沒有次序，變量必須與屬性同名。 ES6 新增特性整理講解 新增命令 1.let命令 ES6新增了let命令，用來聲明變量。它的用法類似于var，但是也存在新的特性。 - **let所聲明的變量，只在le...

    MSchumi 評論0 收藏0

  • ES6基礎(chǔ)知識(shí)01(let,const,解構(gòu)賦值)

    摘要：聲明的變量不得改變值，這意味著，一旦聲明變量，就必須立即初始化，不能留到以后賦值。解構(gòu)賦值允許按照一定模式，從數(shù)組和對象中提取值，對變量進(jìn)行賦值，這被稱為解構(gòu)。對象的解構(gòu)賦值對象的屬性沒有次序，變量必須與屬性同名。 ES6 新增特性整理講解 新增命令 1.let命令 ES6新增了let命令，用來聲明變量。它的用法類似于var，但是也存在新的特性。 - **let所聲明的變量，只在le...

    Gilbertat 評論0 收藏0

  • ES6基礎(chǔ)

    一、塊級作用域 1. var 首先看看ES5中得變量聲明方式 if (true) { var a = 2 } console.log(a) // 2 以上代碼等同于 var a if (true) { a = 2 } console.log(a) 以上可知 ： 在塊內(nèi)部定義變量 變量提升，到函數(shù)最頂部 通過var聲明的變量，無論在何處聲明，均為全局作用域 2.let 和 ...

    BigTomato 評論0 收藏0

發(fā)表評論

0條評論

最新活動(dòng)
閱讀需要支付1元查看
<