ECMAScript 6——數(shù)組

1.擴(kuò)展運(yùn)算符之(spread)(...)

例如:

  1. console.log(...[4,5,6])
    //4 5 6
  2. console.log(1,...[4,5,6],7)
    //1 4 5 6 7
  3. const arr=[...(x>0?['a']:[]),'b'];
    //...運(yùn)算符后面可以放表達(dá)式
  4. [...[],1]
    //[1] ...運(yùn)算符號(hào)是空數(shù)組不產(chǎn)生任何結(jié)果。

可能會(huì)用到的地方:
函數(shù)
例:function f(z,x,c,v,b,n){}
var args=[0,1];
f(-1,...args,2,...[3])
此時(shí)...args等同于...[0,1]也就是0 1

2.es5的apply()方法被es6(spread)(...)取代,更方便。

舉例
<b>1.兩者的對(duì)比之求數(shù)組最大值</b>
例:
//ES5的寫法
Math.max.apply(null,[1,2,3])
//ES6的寫法
Math.max(...[1,2,3])
//等同于
Math.max(1,2,3)

更方便的應(yīng)用于:

1..用于將一個(gè)數(shù)組添加到另一個(gè)數(shù)組的尾部

//ES5的寫法
var arr1=[0,1,2];
var arr2=[3,4,5];
Array.prototype.push.apply(arr1,arr2);
//ES6的寫法
var arr1=[0,1,2];
var arr2=[3,4,5];
arr1.push(...arr2);

2.與解構(gòu)賦值結(jié)合使用,用于返回一個(gè)對(duì)象但是需要不同的分組的情況

const [first,...rest]=[1,2,3,4,5];
//first對(duì)應(yīng)于值1
//rest對(duì)應(yīng)于值[2,3,4,5]

3.函數(shù)返回值,es5中js只能返回一個(gè)值,如果是多個(gè)值則需要返回?cái)?shù)組或者對(duì)象,es6(...)運(yùn)算符可以直接解析返回的一堆數(shù)據(jù)</b>

var dateFields = readDateFields(database);
var d = new Date(...dateFields);

4.用于將字符串轉(zhuǎn)化為真正的數(shù)組</b>

[...'hello']
// [ "h", "e", "l", "l", "o" ]

3.Array.of()

<b>Array.of()將一組值,轉(zhuǎn)化為數(shù)組</b>
Array.of(3, 11, 8) // [3,11,8]
<b>Array.of基本上可以用來替代Array()或new Array(),并且不存在由于參數(shù)不同而導(dǎo)致的重載。它的行為非常統(tǒng)一。</b>
<b>兩者的對(duì)比:</b>
<b>Array()</b>
Array() // []
Array(3) // [, , ,]
Array(3, 11, 8) // [3, 11, 8]
<b>Array.of</b>
Array.of() // []
Array.of(undefined) // [undefined]
Array.of(1) // [1]
Array.of(1, 2) // [1, 2]

4.數(shù)組實(shí)例的 copyWithin()

Array.prototype.copyWithin(target, start = 0, end = this.length)
它接受三個(gè)參數(shù)。

target(必需):從該位置開始替換數(shù)據(jù)。
start(可選):從該位置開始讀取數(shù)據(jù),默認(rèn)為0。如果為負(fù)值,表示倒數(shù)。
end(可選):到該位置前停止讀取數(shù)據(jù),默認(rèn)等于數(shù)組長度。如果為負(fù)值,表示倒數(shù)。

<h3><b>5.數(shù)組實(shí)例的 find() 和 findIndex()</b></h3>
舉例
<b>1.</b>[1, 5, 10, 15].find(function(value, index, arr) {
return value > 9;
}) // 10
<b>2.</b>[1, 5, 10, 15].findIndex(function(value, index, arr) {
return value > 9;
}) // 2

<p>find()方法找到的是第一個(gè)目標(biāo)值,第二個(gè)就不管了。findIndex()找到的是第一目標(biāo)值的索引位子,第二個(gè)就不繼續(xù)找了。當(dāng)然也彌補(bǔ)了indexof()方法的不足</p>
[NaN].indexOf(NaN)
// -1
[NaN].findIndex(y => Object.is(NaN, y))
// 0

<h3><b>6.遍歷數(shù)組的不同方法</b></h3>
entries(),keys() 和 values()。區(qū)別是keys()是對(duì)鍵名的遍歷、values()是對(duì)鍵值的遍歷,entries()是對(duì)鍵值對(duì)的遍歷。
for (let index of ['a', 'b'].keys()) {
console.log(index);
}
// 0
// 1

for (let elem of ['a', 'b'].values()) {
console.log(elem);
}
// 'a'
// 'b'

for (let [index, elem] of ['a', 'b'].entries()) {
console.log(index, elem);
}
// 0 "a"
// 1 "b"

<h3><b>7.includes(),indexOf()查找是否包含某個(gè)值</b></h3>
[1, 2, 3].includes(3, 3); // false 第一個(gè)參數(shù)表示要查找的值,
[1, 2, 3].includes(3, -1); // true
[NaN].indexOf(NaN)
// -1

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容