ES6解構賦值

陣列的解構賦值

陣列的解構賦值需要左邊的變數結構需要等於右邊的值的結構，即給對應位置的變數宣告對應位置的值，變數的取值由位置決定

只要某種資料型別具有迭代器(iterator)介面，就可以使用陣列的解構賦值，不一定非是陣列

es6中具有iterator介面的資料型別有：陣列，類陣列物件，字串，set，map，generator函式

注：物件不具有iterator介面，需要自己配置

var [a,b,c] = ['a','b'];
console.log(a); //a
console.log(b); //b
var [a,[[b],c]] = [1,[[2],3]];
console.log(a); //1
console.log(b); //2
console.log(c); //3
//不完全解構，左邊只是右邊的一部分，但是模式是正確的
var [a,,c] = ['a1','b1','c1','d1'];
console.log(a); //a1
console.log(c); //c1
var [a,...b] = ['a2','b2','c2','d2']; 
//rest引數：...b 獲取多餘的陣列元素，組成乙個新陣列，常用於函式引數中，作用與arguments類似，arguments是類陣列
console.log(a); //a2
console.log(b); //['b2','c2','d2']
var [a,b,...c] = ['a3'];
//rest引數必須是最後乙個元素
console.log(a); //a3
console.log(b); //undefined 解構不成功就是undefined
console.log(c); // rest引數解構不成功是空陣列
//字串具有iterator介面
var [a,b,c] = 'hello';
console.log(a); //h
console.log(b); //e
console.log(c); //l
var [a,b,c] = new set(['aa','bb','cc']);
console.log(a); //aa
console.log(b); //bb
console.log(c); //cc

物件的解構賦值

物件的屬性沒有次序，變數必須與屬性同名，才能取到正確的值，即變數名與屬性名一一對應，次序不重要

var  = 
console.log(foo); //bbb
console.log(bar); //aaa
var  = 
console.log(foo); //undefined 因為變數與屬性名不一致
//解決辦法
//在變數前指定對應的屬性名使用：隔開
var  = 
console.log(foo); //ddd  foo指向baz屬性對應的值
//還可以用於巢狀結構物件, 不過應該很少會這麼做吧。。。
var obj = 
]}var 
]} = obj;
console.log(x); //gary
console.log(y); //guo

如果是先宣告了變數再進行物件解構賦值則需要加上括號，否則js回你認為{}是乙個**塊，而不是解構賦值

var bar;
=  //syntaxerror: expected expression, got '='
console.log(bar);
var bar;
( = )
console.log(bar);  //111 實際開發中不推薦這麼做

物件解構賦值的小應用：求最大值

//正常方法
var arr = [2,5,1,8,4,2];
//簡化
var  = math;
即是將現有方法賦值到變數上使用

ES6 解構賦值

陣列的解構賦值 let a,b 12,13 let a,b,c d 13,15,16 let a,b c 78,12 23 let x,y 1,3,5 x 1,y 3 let x,y,z a x a,y undefined z let h,b 1,2,3,4 1,2,3,4 預設值 let x tr...

ES6解構賦值

一基本用法解構 destructuring 按照一定的模式，從陣列或者物件中提取值，對變數進行賦值。let par1,par2,par3 1,2 console.log par1,par2,par3 1 2 不完全解構時par3對值為undefined 解構賦值允許指定變數對預設值。let pa...

es6解構賦值

coding changes the world accumulating makes yourself 主要從三個方面講述陣列式的解構賦值物件式的解構賦值函式中的解構賦值 preface 現今的變數宣告語法十分的直接左邊是乙個變數名，右邊可以是乙個陣列的表示式或乙個物件的表示式，等等。...

ES6解構賦值

ES6 解構賦值

ES6解構賦值

es6解構賦值

相關推薦