1. 陣列的解構賦值
基本用法
let [a, b, c] = [1, 2, 3];
let [a,,c] = [1,2,3];
let [a,...b] = [1,2,3]; // a=1; b=[2,3]
// set 結構也可以
let [x, y, z] = new set(['a', 'b', 'c']);
// iterator 介面的也可以
function* fibs()
let [first, second, third] = fibs();
third // 3
預設值
let [a=2] = [1];
若值為全等 undefined, 則才為預設值
let [a=2] = [undefined]; // a=2
let [a=2] = [null]; //a = null
let [a=2] = null; // 報錯, 如果模式不是陣列, 因為會兩邊不匹配
let [a=2] = undefined; // 報錯
若預設值是乙個表示式, 那麼這個表示式是 惰性求值, 只有用到的時候才會求值
function f()
let [a=f()] = [1];
a; // 1
// 相當於執行了下面
if( [1][0] === undefined )else
2. 物件的解構賦值
let = ;
a; // 1
其實相當於:
let = ;
// 有點類似於下面的寫法
let _temp = ;
let a = _temp.a || 3;
解構賦值給空陣列和空物件
let [a=3] = {} // ?會報錯: uncaught typeerror: undefined is not a function
let = // 正確 a = 3;
下面的兩種寫法是一樣的, 陣列元素是按次序, 變數的取值由它對應的屬性名決定。
let =
let =
如果變數名與屬性名不一致, 寫成下面這樣, a 是匹配的模式, c 才是變數
let =
c; //1
說明物件的解構賦值是下面形式:
let = ;
// 等價於下面
let =
物件也可以進行巢狀
let , c]} = , 3]}
a; // undefined
b; // 2
c; // 3
巢狀賦值例子:
let obj = {};
let arr = ;
( = );
obj; //
b; // [2]
解構也可以指定預設值, 也是必須 === undefined
let = ;
a; //1
let = ;
a; //null
let = ;
a; // 4
如果解構失敗，變數的值等於undefined
let = ;
a; // undefined
如果解構模式是巢狀的物件，而且子物件所在的父屬性不存在，那麼將會報錯。
// 報錯
let } = ;
相當於:
let _temp = ;
= _temp.foo;
bar = _temp.foo.bar;
已經宣告的變數用於解構賦值, 會將 理解成乙個**塊 而不是乙個語句, 所以要有括號
let x;
= ; // uncaught syntaxerror: unexpected token =
let x;
( = ); // 正確
= ; // 若不用let 也是正確的, foo 直接掛載到 window 下
3. 字串的解構賦值
// 字串轉換成 類似陣列
const [a,b] = 'hello';
a; // h
b; // e
// 字串類似物件, 它有乙個length 的屬性
let = 'hello';
4. 數值和布林值的解構賦值
數值和布林值都會轉好成 包裝物件
// 相當於s = 123.tostirng
let = 123;
// 相當於 s = true.tostring
let = true;
解構賦值的規則是，只要等號右邊的值不是物件或陣列，就先將其轉為物件。
由於undefined和null無法轉為物件，所以對它們進行解構賦值，都會報錯。
let = null; // error
let = undefined; // error
5. 函式引數的解構賦值
function add([x, y])
add([1, 2]); // 3
相當於 [x, y] = [1, 2];
對於 map
// [5, 10]
[1, 2].map( (a) => a *5 );
// [3, 7]
[[1,2], [3,4]].map( ([a,b]) => a+ b )
函式引數的解構也可以使用預設值。
//只有當傳遞的引數為undefined 或不傳引數的時候, 才會執行 =
function move( = )
move(); //
[3, 4]; 等價 =
move(); //
[3, undefined]; 等價 =
move({}); //
[undefined, undefined]; 等價 = {}
move(); //
[undefined, undefined]; 等價 =
move(null); //
報錯; 等價 = null
move(); //
[1, 2]; 等價 =
move(undefined); //
[1, 2]; 等價 =
//同上面道理
function move( = )
move(); //
[3, 4]
move(); //
[3, 0]
move({}); //
[0, 0]
move(); //
[100, 200]
undefined就會觸發函式引數的預設值。
[1, undefined, 3].map( (a = 2) => a ); // [1, 2, 3]
6. 圓括號的問題
使用圓括號的情況
賦值語句並且非模式部分，可以使用圓括號。
( = ); // 正確, 這裡d是非模式, p是模式, 最後 d = 3
let ( = {}); // 錯誤, 因為是聲音語句
[(b)] = [3]; // 正確, 說明這個b是非模式部分, 有點類似於 [0:(b)] = [3], 直接這麼寫會報錯
( = ); // 錯誤, 說明是這麼執行 = ; 括號加在了 a的模式部分
7.用途
1) 交換變數的值
let x=1;
let y=2;
[x,y] = [y,x];
2) 從函式返回多個值
function f()
}let = f();
function f()
let [a, b] = f();
3) 函式引數的定義
function f([x, y, z])
f([1,2,3]);
function f()
console.log(x, y, z); // x = 1, y = 2, z = 3;
}f();
4) 提取json資料
let o =
let = o;
5) 函式引數的預設值
function f()
f({});
f(); // error, 必須至少傳入空物件, 否則會報錯
6）遍歷map結構
var map = new map();
map.set('first', 'hello');
map.set('second', 'world');
for(let item of map)
所以可以寫成:
for(let [key, value] of map)
// 獲取key 的值
for( let [key] of map)
// 獲取value 的值
for( let [, value] of map)
7）輸入模組的指定方法
const = require('./test2')
import from './test2';
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用來表示尚未存在的物件，常用來表示函式企圖返回乙個不存在的...