ES6 ES6學習三 變數的解構賦值

2021-09-19 16:33:38 字數 2180 閱讀 6156

es6 允許按照一定模式，從陣列和物件中提取值，對變數進行賦值，這被稱為解構（destructuring）。

下面介紹的是陣列、物件、字串、數值和布林值、函式引數的解構賦值。

1、模式匹配：只要等號兩邊的模式相同，左邊的變數就會被賦予對應的值。

//以前


let a = 1;


let b = 2;


let c = 3;


//es6


let [a, b, c] = [1, 2, 3];
說明：這種寫法屬於「模式匹配」，只要等號兩邊的模式相同，左邊的變數就會被賦予對應的值。

2、左》右，解構不成功，變數的值就等於undefined。

let [foo] = ;


let [bar, foo] = [1];


//foo的值都會等於undefined
3、左《右：不完全解構，即等號左邊的模式，只匹配一部分的等號右邊的陣列，解構依然可以成功。

let [x, y] = [1, 2, 3];


x // 1


y // 2


let [a, [b], d] = [1, [2, 3], 4];


a // 1


b // 2


d // 4
4、預設值

let [foo = true] = ;


foo // true


let [x, y = 'b'] = ['a']; // x='a', y='b'


let [x, y = 'b'] = ['a', undefined]; // x='a', y='b'
1、物件的解構與陣列有乙個重要的不同：物件的屬性沒有次序，變數必須與屬性同名，才能取到正確的值。

let  = ;


foo // "aaa"


bar // "bbb"


let  = ;


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

let  = ;


baz // "aaa"


foo // error: foo is not defined


//上面物件的解構賦值是下面形式的簡寫：


let  = ;
3、預設值：

預設值生效的條件是，物件的屬性值嚴格等於undefined。

var  = {};


x // 3


var  = ;


x // 1


y // 5


var  = {};


y // 3


var  = ;


y // 5


var  = ;


x // 3


var  = ;


x // null
此時，字串被轉換成了乙個類似陣列的物件。

const [a, b, c, d, e] = 'hello';


a // "h"


b // "e"


c // "l"


d // "l"


e // "o"
類似陣列的物件都有乙個length屬性，因此還可以對這個屬性解構賦值。

let  = 'hello';


len // 5
解構賦值時，如果等號右邊是數值和布林值，則會先轉為物件。

解構賦值的規則是，只要等號右邊的值不是物件或陣列，就先將其轉為物件。由於 undefined 和 null 無法轉為物件，所以對它們進行解構賦值，都會報錯。

let  = 123;


s === number.prototype.tostring // true


let  = true;


s === boolean.prototype.tostring // true


let  = undefined; // typeerror


let  = null; // typeerror
function add([x, y])


add([1, 2]); // 3

ES6 變數解構

es6允許按照一定的模式,從陣列和物件中提取值,對變數進行賦值,這被稱為解構 destructuring 語法 let a,b,c 1,2,3 console.log a,b,c 1 2 3 順序 從陣列中取值,按照對應位置,對變數取值,這種寫法屬於 匹配模式 只要等號兩邊模式相同,左邊的變數就會被...

ES6 變數的解構

預設值 let foo true foo true let x,y b a x a y b let x,y b a undefined x a y b es6 內部使用嚴格相等運算子 判斷乙個位置是否有值。所以，如果乙個陣列成員不嚴格等於undefined，預設值是不會生效的。以下三種解構賦值不得使...

ES6 ES6標準let和const語句

es6 新增了let命令，用來宣告變數。它的用法類似於var，但是所宣告的變數，只在let命令所在的 塊內有效。a referenceerror a is not defined.b 1 上面 在 塊之中，分別用let和var宣告了兩個變數。然後在 塊之外呼叫這兩個變數，結果let宣告的變數報錯，v...