JS學習-解構賦值：陣列解構
阿新 • • 發佈：2020-12-17
技術標籤：前端web前端javascript前端
陣列解構
- 經過解構，接下來的操作完全可以種對變數操作，而不是原來的陣列元素
let arr =['元旦','中秋']
let [NYD,MAF] = arr
console.log(NYD);//元旦
console.log(MAF);//中秋
- 當與 split 函式（或其他返回值是陣列的函式）結合使用時，看起來就更優雅了：
-
let [NYD,MAF] = '中秋 元旦'.split(' ') //NYD:中秋；MAF: 元旦
‘解構’並不意味‘破壞’
- 通過將解構中的各元素複製到變數中來達到‘解構’的目的，但是陣列本身沒有被修改
忽略使用都好的元素
- 在數組裡有不想要的元素也可以通過額外的逗號來丟棄它們：
-
let [A,,C] = ['a','b','c'] console.log(C); // c
等號右側可以是任何可迭代物件
- 實際上，我們可以將其任何的迭代物件一起使用，而不是僅限於陣列：
let [A,B,C] = 'abc';
let [O,T,TH] = new Set([1,1,3,4]); //[1,3,4]
console.log(A);//a
console.log(T);//3
賦值給等號左側的任何內容
- 可以給等號左側使用任何‘可以被賦值的’內容
var user = {} console.log(user.name); [user.name, user.age] = 'CSDN 幾歲了'.split(' ') console.log(user.name); //CSDN
與.entries()方法進行迴圈操作
1.普通的物件
let user ={
name:'元旦',
date:'1.1'
}
for (let [key,value] of Object.entries(user)) {
console.log(`${key}:${value}`);
}
//name:元旦
//date:1.1
- map物件
let user = new Map(); user.set("name","元旦"); user.set('date','1.1'); for (let [key,value] of user) { console.log(`${key}:${value}`); } //name:元旦 //date:1.1
- 交換變數值
let G = 'g';
let H = 'h';
[G,H] = [H,G];
console.log(G,H);//h,g
剩餘的用**…**
若獲取的不只是要獲得第一個值，還需要把後面的元素都收集起來，得需要用**…**和一個引數來接收’剩餘‘的元素
let [a, b, ...c] = ['q', 'w', 'e', 'x', 'd']
console.log(a);//q
console.log(c);//[ 'e', 'x', 'd' ]
預設值
- 變數的數量多於陣列中實際元素的數量，未賦值的變數被認為undefined,若是想要一個預設的值 賦給未賦值的變數，可以使用**=**
let [name =" NAME",age ='20'] = ['Name'];
console.log(name);//Name；
console.log(age);//20