成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

ES6數(shù)組 - 新增的數(shù)組接口方法

caikeal / 2763人閱讀

摘要：一返回符合條件的第一個元素方法接收個參數(shù)，第一個參數(shù)為一個回調(diào)函數(shù)，第二個參數(shù)指定回調(diào)函數(shù)里的。其中，回調(diào)函數(shù)本身接受三個參數(shù)元素的值，元素的下標(biāo)，數(shù)組本身回調(diào)函數(shù)的功能邏輯是想要尋找的元素應(yīng)當(dāng)滿足的某種條件。

一：find() 返回符合條件的第一個元素
find方法接收2個參數(shù)，第一個參數(shù)為一個回調(diào)函數(shù)，第二個參數(shù)指定回調(diào)函數(shù)里的this。大概如下：find(function(value, index, thisArray){}, this)。
其中，回調(diào)函數(shù)本身接受三個參數(shù)：元素的值，元素的下標(biāo)，數(shù)組本身；回調(diào)函數(shù)的功能邏輯是想要尋找的元素應(yīng)當(dāng)滿足的某種條件。一旦某個元素滿足這個條件，則立即返回當(dāng)前元素，不再查找。這就意味著，find()方法會返回滿足條件的第一個元素。我們來看一下具體示例：

let obj = {level: 3};
let array = [1, 2, 3, 4, 5];
let foundItem = array.find(function (value, index, array) {
    return value > this.level;
}, obj);
console.log(foundItem); // 4

我們通過find()方法的第二個參數(shù)傳入obj，這時候回調(diào)函數(shù)里面的this.level就是obj.level為3，我們找到array里第一個大于3的元素，所以得到4.

這里有一點需要注意的是，如果你要指定find()的第二個參數(shù)，那么回調(diào)函數(shù)不能用箭頭函數(shù)。我們都知道箭頭函數(shù)的this在其定義的時候就確定，不能給其指定一個新的this，這樣是不起作用的。

二：findIndex() 返回符合條件的第一個元素下標(biāo)
findIndex()和find()的參數(shù)一樣，唯一的區(qū)別是findIndex()返回的是第一個滿足條件的元素的下標(biāo)：

let obj = {name: "a"};
let array = ["a", "b", "a"];
let foundIndex = array.findIndex(function (value, index, array) {
    return value === this.name;
}, obj);
console.log(foundIndex); // 0

返回第一個滿足條件的元素的下標(biāo)：0。

三：fill()
fill()方法用某個值填充數(shù)組，它接受三個參數(shù), fill(value, startIndex, endIndex)：

1: value用來填充的數(shù)值
2: startIndex 填充的開始坐標(biāo)
3: endIndex 填充結(jié)束的坐標(biāo)，不包含此坐標(biāo)

我們來看看具體的示例：

1: 三個參數(shù)都齊全的情況
let array = [0, 1, 2, 3];
array.fill("a", 0, 2);
console.log(array); //["a", "a", 2, 3]

2: 不傳startIndex和endIndex的情況
let array = [0, 1, 2, 3];
array.fill("a");
console.log(array); //["a", "a", "a", "a"]

這種情況即是用第一個參數(shù)填充整個數(shù)組。

3: 不傳endIndex的情況
let array = [0, 1, 2, 3];
array.fill("a", 1);
console.log(array);//[0, "a", "a", "a"]

這種情況即是用第一個參數(shù)從startIndex一直填充到數(shù)組結(jié)尾。

四：copyWithin()
copyWithin()方法，顧名思義是拷貝數(shù)組自身的某些數(shù)據(jù)來填充數(shù)組本身。它也接受三個參數(shù)，copyWithin(pastedStartIndex, copyStartIndex, copyEndIndex):

1: pastedStartIndex 開始黏貼數(shù)據(jù)的坐標(biāo)
2: copyStartIndex copy開始的坐標(biāo)
3: copyEndIndex copy結(jié)束的坐標(biāo)，但是不包括此坐標(biāo)

來看看代碼示例：

1: 三個參數(shù)都齊全的情況
let array = [0, 1, 2, "D", "E", "F", "G", "H", "I"];
array.copyWithin(3, 0, 5);
console.log(array); // [0, 1, 2, 0, 1, 2, "D", "E", "I"]

我們來分析一下結(jié)果的由來：
1: copyStartIndex = 0，copyEndIndex = 5，那么被copy的元素是： 0, 1, 2, "D", "E" 。
2: pastedStartIndex = 3，那就是從原本的"D"元素所在的坐標(biāo)開始一一對應(yīng)地用0, 1, 2, "D", "E"覆蓋原本的元素 ，其他位置上的元素不變。
3: 所以得到結(jié)果：[0, 1, 2, 0, 1, 2, "D", "E", "I"]

2: 沒有copyStartIndex和copyEndIndex的情況
let array = [0, 1, 2, "D", "E", "F", "G", "H", "I"];
array.copyWithin(3);
console.log(array); // [0, 1, 2, 0, 1, 2, "D", "E", "F"]

copyStartIndex的默認值為0，copyEndIndex = array.length;所以當(dāng)不給以上參數(shù)時，表示拷貝整個數(shù)組。

3: 沒有copyEndIndex的情況

其實上面第二點已經(jīng)說了，copyEndIndex默認值為array.length。所以copyEndIndex沒有傳的情況，就表示從copyStartIndex開始copy到整個數(shù)組結(jié)尾：

let array = [0, 1, 2, "D", "E", "F", "G", "H", "I"];
array.copyWithin(3, 4);
console.log(array); //[0, 1, 2, "E", "F", "G", "H", "I", "I"]

以上就是關(guān)于ES6給Array新增的接口方法。

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/106282.html

相關(guān)文章

  • Javascript內(nèi)置對象新增接口列表

    網(wǎng)上很少有提供不同版本接口對比的文章，所以自己總結(jié)一下。 Array Method Description Modify Version concat 連接多個數(shù)組，返回數(shù)組副本，參數(shù)可以為值或數(shù)組 否 ES3 join 把數(shù)組元素組合為字符串 否 ES3 pop 刪除并返回最后一個元素 是 ES3 push 向數(shù)組末尾添加一個或多個值，返回數(shù)組長度 是 ES3 reve...

    xuhong 評論0 收藏0

  • 工作中常用es6+特性

    摘要：結(jié)合工作中使用情況，簡單對進行一些復(fù)習(xí)總結(jié)，包括常用的語法，等，以及短時間內(nèi)要上手需要重點學(xué)習(xí)的知識點不同工作環(huán)境可能有一些差別，主要參考鏈接是阮一峰的博客以及外文博客阮老師大部分文章是直接翻譯的這個博客簡介先說一下，是一個標(biāo)準(zhǔn)化組織，他們 結(jié)合工作中使用情況，簡單對es6進行一些復(fù)習(xí)總結(jié)，包括常用的語法，api等，以及短時間內(nèi)要上手需要重點學(xué)習(xí)的知識點（不同工作環(huán)境可能有一些差別），...

    xcold 評論0 收藏0

  • es6 promise面試

    摘要：執(zhí)行函數(shù)會返回一個遍歷器對象，每一次函數(shù)里面的都相當(dāng)一次遍歷器對象的方法，并且可以通過方法傳入自定義的來改變函數(shù)的行為。函數(shù)可以通過配合函數(shù)更輕松更優(yōu)雅的實現(xiàn)異步編程和控制流管理。它和構(gòu)造函數(shù)的不同點類的內(nèi)部定義的所有方法，都是不可枚舉的。 let const的命令 在ES6之前，聲明變量只能用var，var方式聲明變量其實是很不合理的，準(zhǔn)確的說，是因為ES5里面沒有塊級作用域是很不合...

    timger 評論0 收藏0

  • JavaScript 語言核心筆記（持續(xù)更新）

    摘要：在同一個塊內(nèi)，不允許用重復(fù)聲明變量。中為新增了塊級作用域。自帶遍歷器的對象有數(shù)組字符串類數(shù)組對象對象的對象等和結(jié)構(gòu)對象。返回一個遍歷器，使遍歷數(shù)組的鍵值對鍵名鍵值。 目錄 1.語法 2.類型、值和變量 3.表達式和運算符 4.語句 5.數(shù)組 6.對象 7.函數(shù) 8.全局屬性和方法 9.詞法作用域、作用域鏈、閉包 10.原型鏈、繼承機制 11.this的理解 12.ES5新特性 13.E...

    suosuopuo 評論0 收藏0

  • JavaScript 設(shè)計模式（五）：迭代器模式

    摘要：文章內(nèi)容分兩部分前半部分為迭代器模式概念后半部分為中迭代器上半部分開始迭代器模式提供一種方法順序訪問一個聚合對象中的各個元素，而又不需要暴露該對象的內(nèi)部表示。下半部分開始的迭代器迭代器等同于遍歷器。執(zhí)行該函數(shù)，會返回一個遍歷器對象。 showImg(https://segmentfault.com/img/bVbuyaZ?w=800&h=600); 文章內(nèi)容分兩部分： 前半部分為 迭...

    zhou_you 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<