解構(gòu)賦值
解構(gòu)賦值
變量的賦值可以按照一定的模式批量賦值
數(shù)組模式
根據(jù)下標(biāo)一一對(duì)應(yīng)賦值
var [a,b,c] = [1,2.3]
等同于
var a =1;
var b =2;
var c=3
- 多維數(shù)組同理
- 解構(gòu)失敗時(shí)賦值為undefined
var [a,b] = [1];
//a =1;
//b=undefined;
- 設(shè)默認(rèn)值
var [a,b=2] = [1];
//a=1;
//b=2;
對(duì)象模型
根據(jù)key值一一對(duì)應(yīng)賦值,注意此時(shí)value應(yīng)該是變量而非字符串普泡。
var {a:a,b:b}={a:1,b=2};
//ES6對(duì)象key省略時(shí)域那,key value同名咙边,也可以寫(xiě)成這樣
var {a,b} = {a:1,b:2};
- 解構(gòu)失敗為undefined
var {c} = {a:1,b:2};
//c=undefined;
- json形式時(shí),也是一一對(duì)應(yīng)次员,位置相同即可
- 默認(rèn)值
var {a,b=2}={a:1};
//b=2;
- 對(duì)于已定義的變量败许,使用對(duì)象模式需要注意(),否則等號(hào)兩邊被認(rèn)為是兩個(gè)代碼塊淑蔚。
let a ;
{a}={a:1};
//SyntaxError
let b ;
{市殷={b:2}};
//b=2;
其他情況
- 當(dāng)右邊表達(dá)式是字符串,類(lèi)似數(shù)組刹衫,也是根據(jù)下標(biāo)計(jì)算醋寝。
const [a,b,c]='123''
//a='1';b='2';c='3''
- 當(dāng)右邊是其他類(lèi)型時(shí)會(huì)被轉(zhuǎn)為對(duì)象,在進(jìn)行解構(gòu)賦值带迟。
注:null和undefined無(wú)法轉(zhuǎn)為對(duì)象音羞,會(huì)報(bào)錯(cuò)。
其他應(yīng)用
- 函數(shù)參數(shù)
//形參寫(xiě)成數(shù)組
function fn([a,b]){
...
};
fn([1,2]);
//形參寫(xiě)成對(duì)象仓犬,不必考慮傳入順序
function fn (a,b){
..
};
fn({b:2,a:1});
- 形參默認(rèn)值的2種寫(xiě)法嗅绰,一種是解構(gòu)賦值寫(xiě)法,一種是ES6中形參設(shè)置默認(rèn)值的方式
funtion fn({a,b}={1,2}){
...
};
- 函數(shù)返回多個(gè)值搀继,一次性接收
function fn(){
return [1,2,3]
};
let [a,b,c]=fn();
- 交換值
[y,x]=[x,y]
數(shù)組(一)
ES6數(shù)組新增的方法(部分為ES5方法)
1.concat()
合并數(shù)組窘面,該方法會(huì)改變?cè)瓟?shù)組
2.reverse()
反轉(zhuǎn)數(shù)組
3.Array.isArray()
判斷是否是數(shù)組,等效于Object.prototype,toString.call(xx)==="[objectArray]"
4.forEach(fn(val,index,arr))
ES5的方法叽躯,低版本瀏覽器不兼容民镜,此方法用來(lái)遍歷數(shù)組,參數(shù)中arr指數(shù)組本身险毁,arr.forEach(function(val,index,arr){...})
5.map(fn(val,index,arr))
遍歷制圈,返回一個(gè)新數(shù)組们童,此函數(shù)參數(shù)為數(shù)組中的單個(gè)值(react中用較多)
var numbers = [1,2,3];
numbers.map(function(n){
return n+1;
});
//[2,3,4]
6.filter(fn(val,index,arr))
過(guò)濾,返回一個(gè)新數(shù)組鲸鹦,它由fn函數(shù)返回true時(shí)的val組成
let arr= [3,4,5.6.7]
arr.filter(function(val){
return val>4;
})
//[[5,6,7]
7.some(fn(val,index,arr))
查找慧库,其中一個(gè)值經(jīng)過(guò)函數(shù)處理返回了true,則返回true馋嗜,認(rèn)為數(shù)組中包含符合條件的值
let arr=[2,3,4,5,6];
arr.some(function(elem,index,arr){
return elem>=3
});
//true
8.every((val,index,arr))
類(lèi)似some,fn都返回true齐板,則返回true
9.reduce(fn(val,index,arr),ex)
合并,返回ex葛菇,默認(rèn)是數(shù)組中的第一個(gè)val甘磨,也可以用第二參數(shù)指定
let arr=[1,2,3,4,5];
arr.reduce(function(ex,val){
return ex+val;
},10);
//25
let json=['aaa','bb','c'];
json.reduce(function(logest,entry){
return.entry.length>longest.length?entry:longest;
},");
9.find(fn(val,index,arr))
查找第一個(gè)符合fn的值,fn應(yīng)該返回t/f眯停,差不到返回undefinde
let arr= [1,2,3]
arr.find(function(val){
return val>1;
})
//2
比indexof強(qiáng)大济舆,且可查找NaN
- findindex(fn(val,index,arr))
類(lèi)似find,返回符合fn的下標(biāo)莺债,查不到返回-1滋觉。
11.keys()返回?cái)?shù)組所有key組成的遍歷器對(duì)象
遍歷器對(duì)象在后面詳解,它可以使用for.....of遍歷
let arr=[1,2,3]
for (let i of arr.keys()){
console.log(i)
}
//1,2,3
12.valus()類(lèi)似keys()齐邦,返回所有value
13.entries()返回所有key value
var arr = [1,2,3]
for(let i of arr.entries()){
console.log(i)
}
//[0,1] [下標(biāo)椎侠,值] //[1,2] //[2,3]
14.Array.from(arrlike,[fn(value)])
將數(shù)組轉(zhuǎn)化為數(shù)組,替代Arrar.prototype.slice,call,fn用來(lái)返回新值措拇。
常見(jiàn)的類(lèi)數(shù)組
- DOM操作返回的是節(jié)點(diǎn)集合
let p = document.getElementsByTagName("p");
Array.from(p).forEach(fn...);
//正常情況下頁(yè)可使用for循環(huán)我纪,長(zhǎng)度為類(lèi)數(shù)組的length
- 函數(shù)內(nèi)部的anguments也是累數(shù)組
注:具有l(wèi)terator接口的都可使用Array.from()
除了上述方法以外,還有其他諸如數(shù)組填充fill()等不怎么用到的方法丐吓,這里就不再列出宣羊。