ES6精解變數的解構賦值

我們知道以前我們給乙個變數賦值要這樣如下：

let a = 1;
let b = 2;
let c = 3;

但是es6出來之後，我們可以這樣：

let [a, b, c] = [1, 2, 3]

以上就是從陣列中提起值，一一對應賦值，a、b、c分別為1、2、3

let [aa, [[bb], cc]] = [1, [[2], 3]]

aa,bb,cc分別對應1,2,3

let [,,d] = [10, 20, 30];
console.log(d);

d的值為30

let [e, ...f] = [1, 2, 3, 4, 5];

e為1, f為[2,3,4,5]

let [x, y, ...z] = [1];

x為1，y為undefined，z為，如果沒有對應值會等於undefined

解構賦值也允許預設值，如下：

let [ x = '預設值'] = ;

x的值為預設值

let [ a = 123 ] = [ undefined ];
let [ b = 321 ] = [ null ];

a的值為123，b的值為321，因為es6中是嚴格遵循（===），所以只有當陣列對應的值為undefined的時候，才能等於預設值

預設值可以引用解構賦值的其他變數，但是這個變數必須得宣告過的，如下：

let [ a = 0, b = a] = ;

這裡a、b分別為0,0

但是如果這個變數沒有宣告，就會報錯，如下：

let [ a = b, b = 1] = ;

這裡就會報錯：uncaught referenceerror: b is not defined

let  = ;

a,b的值為1,2

物件解構賦值可以無需按照順序一一對應，但是括號兩邊的變數名稱和屬性名稱要相同，才能取到正確值

let  = ;

a為1，b為undefined，這裡b在右邊括號中沒有對應的屬性值與其對應，所以此時b為undefined

如果變數名和屬性名不一樣，則要按照如下寫：

let  = ;

fa為1，fb為2

這裡可以說明，物件解構賦值實際上是如下的簡寫：

let  =

也就是說，物件的解構賦值的內部機制，是先找到同名屬性，然後再賦給對應的變數。真正被賦值的是後者，而不是前者。

let  = 
//fa為 1
//aa為 uncaught referenceerror: aa is not defined

這裡就說明了，fa是真正被賦值的,此時的aa是模式而不是變數，如果你要讓aa為變數，則如下：

= ;
// aa 為 1
// fa 為 1
}

此時aa為1，bb為1,此時aa就是變數了

當然物件也可以多層巢狀如下：

]
}let ]} = obj;
console.log(x); // 1
console.log(y); // 2
}

;
let arr = ;
( = );
console.log(obj); // 
console.log(arr); // [123]
}

物件解構預設值：

= {};
console.log(x); //1
}= {};
console.log(y); //4
}= ;
console.log(y); //5
}

預設屬性生效條件必須是物件的屬性嚴格等於undefined，如果是null就不會生效，如下：

= ;
console.log(x); //null
}

已宣告的變數解構賦值：

= );
console.log(1); // 1
}

得要加個小括號才可以，否則會報錯；

陣列對應物件屬性的解構：

= arr;
console.log(one); // 1
console.log(three); // 3
}

字串也可以解構賦值，因為字串可以轉換成乙個類似陣列的物件

類似陣列的物件都有乙個length屬性，可以對這個屬性解構賦值

= 'hero';
console.log(len); // 4
}

解構賦值時，如果等號右邊是數值或者布林值時，則會先轉換成物件

= 123;
console.log(s === number.prototype.tostring); //true
}    = true;
console.log(s === boolean.prototype.tostring); //true
}

解構賦值的規則：如果等號右邊的值不是物件或者陣列則會先轉為物件，由於undefined和null無法轉為物件，所以無法對它們進行解構賦值，會報錯，如下：

= undefined; //報錯
let  = null; //報錯
}

函式引數預設值：

function func( = {}) 
console.log(func()); //[5,6]
console.log(func()); //[5,0]
console.log(func({})); //[0, 0]
console.log(func()); //[0, 0]

如果按照以下定義就不同了，如下：

function fn( = ) 
console.log(fn()); // [11, 22]
console.log(fn()); // [11, undefined]
console.log(fn({})); // [undefined, undefined]
console.log(fn()); // [1, 2]

undefined會觸發函式引數的預設值，如下：

圓括號只能一種情況才能使用：賦值語句的非模式部分，可以使用圓括號

[(b)] = [3]; // 正確
( = {}); // 正確
[(parseint.prop)] = [3]; // 正確

上面三行語句都可以正確執行，因為首先它們都是賦值語句，而不是宣告語句；其次它們的圓括號都不屬於模式的一部分。第一行語句中，模式是取陣列的第乙個成員，跟圓括號無關；第二行語句中，模式是p，而不是d；第三行語句與第一行語句的性質一致。

es6變數解構賦值

es6允許按照一定模式，從陣列和物件中提取值，對變數進行賦值，這被稱為解構。解構賦值在實際開發中可以大量減少我們的量，並且讓我們的程式結構更清晰。陣列的解構賦值 let a,b 1 2 console.log a 1 console.log b 2 上面的表示，可以從陣列中提取值，按照位置的物件...

ES6變數解構賦值

es6 允許按照一定模式，從陣列和物件中提取值，對變數進行賦值，這被稱為解構 es6之前我們申明多個變數需要按照下面的方法 let l a 1 let b 2 let c 3 let d 4 或者 let a 1,b 2,c 3,d 4 現在我們可以更加簡便 let a,b,c,d 1,2,3,4 ...

es6 變數解構賦值

1.陣列的解構賦值等號兩邊的模式相同，左邊的變數就會被賦予對應的值預設值 undefined型別只有乙個值，即undefined。當宣告的變數還未被初始化時，變數的預設值為undefined。null型別也只有乙個值，即null。null用來表示尚未存在的物件，常用來表示函式企圖返回乙個不存在的...

ES6精解 變數的解構賦值

es6變數解構賦值

ES6變數解構賦值

es6 變數解構賦值

相關推薦

ES6精解變數的解構賦值