數(shù)組結(jié)構(gòu)賦值
數(shù)組解構(gòu)賦值--數(shù)組解構(gòu)賦值是按照元素位置一一對(duì)應(yīng)?進(jìn)性解構(gòu)賦值
const?[a,?b,?c,?d]?=?[1,?2,?3,?4]
console.log(a,?b,?c,?d);? ? // 1,2,3,4
不完全解構(gòu)
const?[,?e,?r,]?=?[1,?2,?3,?4]
console.log(e,?r);? ? ?// 2,3
只解構(gòu)一個(gè)a
const?[a]?=?[1,?2,?3,?4]
console.log(a);? ?// 1
解構(gòu)最后一個(gè)
const?[,?,?,?r]?=?[1,?2,?3,?4]
console.log(r);? ?// 4
嵌套數(shù)組解構(gòu)
const?arr?=?[1,?[2,?[3,?4,?[5]]]]? ? ? ? ? ? const?[,?[,?[w,?,?[i]]]]?=?arr? ?? console.log(w,?i);? // 3,5?
解構(gòu)剩余數(shù)組元素(解構(gòu)剩余參數(shù))
const?[one,?...args]?=?[1,?2,?3,?4]
console.log(one,?args);? ? // 1,[2,?3,?4]
數(shù)組解構(gòu)賦值默認(rèn)值? ? ? 生效條件:被結(jié)構(gòu)數(shù)組中的元素等于undefined
const?[a?=?1,?b?=?2,?c?=?3]?=?[11,?22]? ? ? ? console.log(a,?b,?c);? ? // 11?22?3
const?[a?=?1,?b?=?2,?c?=?3]?=?[11,?22,?undefined]? ?? console.log(a,?b,?c);? ? // 11?22?3
const?[a?=?1,?b?=?2,?c?=?3]?=?[]? ? ? ? console.log(a,?b,?c);? ? ? //?1?2?3
const?[a,?b]?=?[]? ? //undefined? ? ? ? ? console.log(a,?b);? ?? ?//?undefined?undefined
對(duì)象解構(gòu)賦值
對(duì)象解構(gòu)賦值是按照對(duì)象屬性名進(jìn)行匹配鲤脏,匹配成功之后進(jìn)行結(jié)構(gòu)賦值的
const obj = { a: undefined, b: undefined, c: 33, d: 44, e: 55 }
結(jié)構(gòu)剩余參數(shù)
const { e, a, d, ...t } = obj;
console.log(e, a, d);? ? // 55 undefined 44
console.log(t);? ? ? ? ? ? // {b: undefined, c: 33}
不完全批配
const?{?a,?b?}?=?obj? ?? console.log(a,?b);? ? //undefined undefined
對(duì)象結(jié)構(gòu)賦值默認(rèn)值? ? ?? 生效條件:匹配到的屬性值為undefined
const?{?a?=?1,?b?=?2,?c?=?3,?e,?f?}?=?obj? ? ?? console.log(a,?b,?c,?e,?f);? ? //1 2 33 55 undefined
const?{?aa?=?11,?bb?=?22,?cc?=?33?}?=?{}? ? ?? console.log(aa,?bb,?cc);? ? //11 22 33
對(duì)象結(jié)構(gòu)賦值別名
進(jìn)行對(duì)象結(jié)構(gòu)賦值別名操作時(shí),前者知識(shí)用來(lái)匹配畸肆,真正被賦值的是后者(也就是別名)
const?obj?=?{a:?1,?b:?2,?c:?3,?d:?4 }? ? ??
const?{?a:?aaa,?b:?bbb,?c:?ccc,?d?}?=?obj
?console.log(aaa,?bbb,?ccc);? ? //1 2 3
console.log(aaa,?bbb,?ccc,?d);? ?//1 2 3 4
結(jié)構(gòu)剩余參數(shù)---使用延展參數(shù)語(yǔ)法
const?{?a,?...w?}?=?obj
console.log(a ,w);? //1? ,? {b: 2, c: 3, d: 4}