ES6 03陣列和物件的解構

2022-09-10 07:57:16 字數 1737 閱讀 7198

要點:1.陣列物件 2.物件解構

一、陣列解構

2.為什麼用,因為json格式的普及 ,導致大量資料提取工作

3.這個提取過程在es6的解構語法中帶來極大的便利

4.陣列解構賦值,兩種基本寫法:1.分行解構 2.單行解構

let info=['mr.lee',100 ,'男']; //

陣列賦值

let [name,age,gender] = info; //

陣列解構賦值

let info=['mr.lee',100,'男'],

[name,age,gender] =info ;//

同上//

單行解構,以上均可輸出name值

let [name,age,gender]=['mr.lee',100,'男'];

console.log(name);

5.分行或單行,都可以確定必須一一完美匹配才可以正確賦值

//

陣列層次也需要匹配

let [name,[age,gender]] = ['mr.lee',[100,'男']]; //

用逗號作為佔位符不賦值

let[,,gender]=['mr.lee',100,'男'];

6.變數解構時,可在陣列元素中設定乙個預設值

//

當gender沒有賦值時,採取預設值

let [name,age,gender='男']=['mr.lee',100];

7.還有一種...var語法,可將沒有賦值的內容都賦值給這個變數

//

不定元素,將其餘都賦值給other

let [name,...other]=['mr.lee',100,'男'];

二.物件解構

1.物件的解構方法和陣列大同小異,定義乙個物件字面量,解構賦值

//

定義物件字面量

let obj=;

let =obj;

console.log(name);

console.log(age); //

解構物件至變數

let =obj; //

或(=obj);

//直接輸出變數

console.log(name);

console.log(age);

2.若解構的變數名是已經存在的變數,會導致

let obj=,name='mr.wang';  //

被替代(=obj);

console.log(name);

3.物件變數解構也可以設定成乙個預設值,在沒有賦值時輸出預設值;

let obj=;

let =obj;

console.log(gerder)

//如果沒有預設值則unidentified

4.如果不想要物件屬性名作為解構變數,可通過鍵值對的方式更改變數名

let =obj;   //

name將失效

5.在物件字面量裡,還巢狀了物件,解構時也用同樣的方法是解開即可;

let obj=

}let }=obj;

console.log(gender);

6.物件的解構也支援單行的簡寫模式,

let =;

console.log(name);

ES6 2 解構賦值(陣列和物件)

1.解構賦值 destructuring es6 允許按照一定模式,從陣列和物件中提取值 變數值的 對變數進行賦值 作用 這被稱為解構。2.陣列的解構賦值 let arr 1,2,3 let a,b,c arr console.log a,b,c 1 2 3let b,c 1,2,3 console...

es6 物件解構 陣列解構 引數解構

使用es6的一種語法規則,將乙個物件或陣列的某個屬性提取到某個變數中。解構不會對解構的目標造成任何影響 對於物件,在我們要使用它的屬性時,通常把屬性儲存在變數裡 const user const age user.age const name user.name const user.或者如下分開宣...

es6 陣列與物件解構賦值

問題 從陣列或物件中提取資訊 傳統方法 let obj letname obj name let age obj.age varible1,varible2,variblen array let arr 1 2,3 let a arr 0 傳統方法 let b arr 1 let c arr 2 l...