国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

數組方法find、filter、findIndex簡介

Yangder / 436人閱讀

摘要：方法，意思為過濾，同樣接收一個回調函數，該方法的使用場景是查找數組內符合指定條件的所有元素。

前言

ES6提供了很多新的API，數組對象的尤為實用，但是如果我們沒有在相對應的開發環境下，很難對這些API有深入的了解，畢竟實踐出真知。

find、filter、findIndex這三個方法都是對于數組的查找，其中返回的值略微相關，所以在這里做一個介紹。

Array.prototype.find()

這是一個數組原型上的方法，調用格式應該是使用數組對象來調用，該方法接收一個回調函數callback，如：array.find(callback)。
find方法用途是 查找符合條件的第一個數組元素
例子：

var array = [1,4,6,7,9,11,13];
//需求： 查找大于10的第一個數
function callback(elem){
    return elem > 10;
}
var dayu10 = array.find(callback);
console.log(dayu10); // 11

如果找不到，返回undefined
例子：

var array = [1,4,6,7,9,11,13];
//需求： 查找大于100的第一個數
function callback(elem){
    return elem > 100;
}
var dayu100 = array.find(callback);
console.log(dayu100); // undefined

很顯然，這個方法比較適合用來 判斷數組內是否包含某種條件的值的元素。
或者進一步擴展，查找json數組內包含某個值的對象。如下：

var array = [
    {name:"xxa",age: 15},
    {name:"xxb",age:18}
];
var xx = array.find(elem => elem.name === "xxa");
console.log(xx); // {name:"xxa",age: 15}
Array.prototype.findIndex()

作為原型上的方法，調用和參數與find相同。
顧名思義，這個對比find方法，這個方法返回的是符合條件的元素的下標index。
例子：

var array = [1,4,6,7,9,11,13];
//需求： 查找大于10的第一個數
function callback(elem){
    return elem > 10;
}
var dayu10index = array.find(callback);
console.log(dayu10index); // 5

如果找不到，返回-1，這點類似字符串查找的indexOf或者正則表達式的search，總而言之，無論什么查找方法，找不到就是-1.
例子：

var array = [1,4,6,7,9,11,13];
//需求： 查找大于100的第一個數
function callback(elem){
    return elem > 100;
}
var dayu100index = array.find(callback);
console.log(dayu100index); // -1

很顯然，這個方法更適合用來 判斷數組內是否包含某種條件的值的元素。

Array.prototype.filter()

作為原型上的方法，調用和參數如上。
filter方法，意思為過濾，同樣接收一個回調函數callback，該方法的使用場景是 查找數組內符合指定條件的所有元素。
例子：

var array = [1,6,5,9,7,16,18];
//查找偶數
function callback(elem){
    return elem % 2 === 0;
}
var oushu = array.filter(callback);
console.log(oushu);// [6,16,18];

該方法返回的是一個集合，即數組如果找不到，返回空數組[]。
例子：

var array = [1,6,5,9,7,16,18];
//查找大于20的數
function callback(elem){
    return elem > 20;
}
var dayu20 = array.filter(callback);
console.log(dayu20);// [];
結語

這三個方法，都是對數組元素的查找，find返回第一個符合的元素的值，findIndex返回第一個符合的元素的下標，filter返回符合的元素的集合。
這三個方法都不會改變原數組的值，具有很大的相同點，所以在這里統一介紹。
相關鏈接 MDN web docs -- Array

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/103306.html

相關文章

  • 生動形象解釋forEach、filter、map、some、every、find、findIndex

    摘要：前言從最開始學的循環遍歷方法，到后來層出不窮的各種遍歷方法，其實最大的區別就是應用場景的不同。我們最需要記住的就是，什么情況下用哪一種方法比較合適。 前言 從最開始學的for循環遍歷方法，到后來層出不窮的各種遍歷方法，其實最大的區別就是應用場景的不同。我們最需要記住的就是，什么情況下用哪一種方法比較合適。 從挑土豆開始 showImg(https://segmentfault.com/...

    Luosunce 評論0 收藏0

  • forEach、map、filter、find、sort、some等易錯點整理

    摘要：最近手頭上做了一個很大的后臺管理項目，前端對復雜數據的處理要求頗高，也確實讓自己發現了很多之前被忽視的細節。鳴人佐助卡卡西佐助佐助佐助但是很遺憾及更早版本也不支持。 ??最近手頭上做了一個很大的后臺管理項目，前端對復雜數據的處理要求頗高，也確實讓自己發現了很多之前被忽視的細節。在此特整理出來，希望不熟悉的朋友們們以后可以繞開我踩的這些坑。本文初衷在于幫助大家梳理一些數組操作上的重點和易...

    AJie 評論0 收藏0

  • JavaScript數組迭代（遍歷）方法

    摘要：正文和中新增的的數組迭代方法如下其中，是新增的，其余都是新增的。指數組后，返回過濾后的新數組。它的參數跟方法是一樣的所有數組成員依次執行回調函數，直到找出第一個返回值為的成員，然后返回該成員。 前言 ES5和ES6中新增了不少東西，對于數組而言，新增了不少迭代方法，讓我們可以拋棄for循環，更方便的寫JS代碼。 正文 ES5和ES6中新增的的數組迭代方法如下： forEach map...

    light 評論0 收藏0

  • JavaScript30秒， 從入門到放棄之Array（五）

    摘要：原文地址秒，從入門到放棄之五博客地址秒，從入門到放棄之五水平有限，歡迎批評指正從給定的數組中隨機選出指定個數的數組元素。否則判斷數組元素是否大于或者等于指定元素，尋找過程與前邊類似。 原文地址：JavaScript30秒， 從入門到放棄之Array（五）博客地址：JavaScript30秒， 從入門到放棄之Array（五） 水平有限，歡迎批評指正 sampleSize Gets n...

    dunizb 評論0 收藏0

  • [翻譯]map和reduce，處理數據結構的利器

    摘要：一個簡單的實踐返回數組或類似結構中滿足條件的第一個元素。這個翻譯項目才開始，以后會翻譯越來越多的作品。 原文地址：https://codeburst.io/writing-javascript-with-map-reduce-980602ff2f2f 作者：Shivek Khurana 簡介：本文是一份編寫優雅、簡潔和函數式ES6代碼的快捷清單。 現如今JavaScript有許多問...

    233jl 評論0 收藏0

發表評論

0條評論

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