本文實(shí)例講述了ES6數(shù)組與對(duì)象的解構(gòu)賦值。分享給大家供大家參考，具體如下：

數(shù)組的解構(gòu)賦值

基本用法

ES6允許按照一定的模式，從數(shù)組和對(duì)象中提取值，對(duì)變量進(jìn)行賦值，這被稱之為解構(gòu)(Destructuring)

// 以前為變量賦值，只能直接指定值var a = 1;var b = 2;var c = 3;// ES6允許寫成這樣var [a,b,c] = [1,2,3];

本質(zhì)上，這種寫法屬于“模式匹配”，只要等號(hào)兩邊的模式相同，左邊的變量就會(huì)被賦予對(duì)應(yīng)的值。

下面是一些使用嵌套數(shù)組進(jìn)行解構(gòu)的例子：

let [foo,[[bar],baz]] = [1,[[2],3]];foo // 1bar // 2baz // 3let [,,third] = ["foo","bar","baz"];third // "baz"let [head,...tail] = [1,2,3,4];head // 1tail // [2,3,4]let [x,y,...z] = ['a'];x // "a"y // undefinedz // []

默認(rèn)值

解構(gòu)賦值允許制定默認(rèn)值

var [foo = true] = [];foo // true[x,y='b'] = ['a'];// x='a', y='b'

注意，ES6內(nèi)部使用嚴(yán)格相等運(yùn)算符(===)，判斷一個(gè)位置是否有值。

所以，如果一個(gè)數(shù)組成員不嚴(yán)格等于undefined，默認(rèn)值是不會(huì)生效的。

var [x=1] = [undefined];x //1var [x=1] = [null];x // null

如果默認(rèn)值是一個(gè)表達(dá)式，那么這個(gè)表達(dá)式是惰性求值的，即只有在用到的時(shí)候，才會(huì)求值：

function f(){ console.log('aaa');}let [x=f()] = [1];

上面的代碼中，因?yàn)閤能取到值，所以函數(shù)f()根本不會(huì)執(zhí)行。上面的代碼其實(shí)等價(jià)于下面的代碼：

let x;if([1][0] === undefined){ x = f();}else{ x = [1][0];}

默認(rèn)值可以引用解構(gòu)賦值的其他變量，但該變量必須已經(jīng)聲明：

let [x=1,y=x] = [];// x=1; y=1let [x=1,y=x] = [2];// x=2; y=2let [x=1,y=x] = [1,2];// x=1; y=2let [x=y,y=1] = []; // ReferenceError

上面最后一個(gè)表達(dá)式，因?yàn)閤用到默認(rèn)值是y時(shí)，y還沒(méi)有聲明。

對(duì)象的解構(gòu)賦值

解構(gòu)不僅可以用于數(shù)組，還可以用于對(duì)象

var {foo,bar} = {foo:"aaa",bar:"bbb"};foo // "aaa"bar // "bbb"

對(duì)象的解構(gòu)和數(shù)組有一個(gè)重要的不同。數(shù)組的元素是按此排序的，變量的取值由它的位置決定；而對(duì)象的屬性沒(méi)有次序，變量必須與屬性同名，才能取到正確的值。

var {bar,foo} = {foo:"aaa",bar:"bbb"};foo // "aaa"bar // "bbb"var {baz} = {foo:"aaa",bar:"bbb"};baz // undefined

如果變量名與屬性名不一致，必須寫成這樣：

var {foo:baz} = {foo:"aaa",bar:"bbb"};baz // "aaa"let obj = {first:"hello",last:"world"};let {first:f,lats:l} = obj;f // "hello"l // "world"

對(duì)象的解構(gòu)賦值是內(nèi)部機(jī)制，是先找到同名屬性，然后再賦給對(duì)應(yīng)的變量。