結構賦值

解構賦值就是從目標物件或陣列中提取自己想要的變數

注意

1. 左右的結構必須一樣

   var a,b
    [a,b]=[1,2];//左右資料結構必須一樣
    {a,b}=[1,5]//不一樣就會報錯
   
   console.log(a)//1
   console.log(b)//2
   

2. 陣列需要左右對應，物件必須要是鍵值對

var a,b
 [a,b]=[1,2];//陣列結構一一對應
({a,b}={b:10,a:20})//物件的取的是鍵值對
console.log(a)//（1）1（2）12
console.log(b)//（1）2（2）20

3.延展操作符必須要放在最後面

var a,b,rest,c
// [a,b,...rest,c]=[10,20,50,54,21,25,16]//這樣就會報錯
 

[a,b,...rest]=[10,20,50,54,21,25,16]//正常的操作
console.log(a)//10
console.log(b)//20
console.log(rest)//剩餘的陣列

應用

element-ui,vant-ui按需引入，請求介面返回資料，提取想要資料。

1.陣列可以加預設值(沒有傳參就是預設值傳參了就是傳的引數)

var a,b
[a=5,b=10]=[13]
console.log(a)//13
console.log(b)//10

2.交換變數

var a=1;
var b=3;
[a,b]=[b,a]//實現了交換
console.log(a)//3
console.log(b)//1
 

​ 3.忽略你不感興趣的返回值

function f(){
    return [1,2,3];
}
var [a,,b]=f();
console.log(a)//1
console.log(b)//3

4.將剩餘陣列賦值給一個變數

var [a,...b]=[1,4,2,3,5,6,7,9,8]
console.log(a);//第一個數字
console.log(b)//將剩下的展開數字

5.for of 迭代和解構

var people=[
    {
        name:"張三",
        age:"10"
    },
    {
        name:
 
"李四",
        age:"18"
    }
]
for(var {name:n} of people){
    console.log("Name:"+n)
}