數組 filter、some、map、foreach的操作分別有什么作用?

1.背景介紹

ECMAScript5為數組定義了5個迭代方法。every()、filter()、forEach()、map()、some()。這5個方法都接收兩個參數:運行的函數和運行該函數的作用域對象this的值。

循環(loop),指的是在滿足條件的情況下,重復執行同一段代碼。比如,while語句。

迭代(iterate),指的是按照某種順序逐個訪問列表中的每一項。比如,for語句。

遍歷(traversal),指的是按照一定的規則訪問樹形結構中的每個節點,而且每個節點都只訪問一次。

遞歸(recursion),指的是一個函數不斷調用自身的行為。比如,以編程方式輸出著名的斐波納契數列。

大家好,我是IT修真院深圳分院第03期學員,一枚正直善良的web程序員。

2.知識剖析

2.1、數組方法

every():對數組中的每一項運行給定函數,如果該函數對每一項都返回true,則返回true。

filter():對數組中的每一項運行給定函數,返回該函數會返回true的項組成的數組。

forEach():對數組中的每一項運行給定函數。這個方法沒有返回值。

map():對數組中的每一項運行給定函數,返回每次函數調用的結果組成的數組。

some():對數組中的每一項運行給定函數,如果該函數對任一項返回true,則返回true。

2.2、some()

some方法為數組中的每一個元素執行一次callback函數,直到找到一個使得callback返回一個“真值”(即可轉換為布爾值true的值)。如果找到了這樣一個值,some將會立即返回true。否則,some返回false。

語法:arr.some(callback[, thisArg])

2.3、every()

every方法為數組中的每個元素執行一次callback函數,直到它找到一個使callback返回false(表示可轉換為布爾值false的值)的元素。

如果發現了一個這樣的元素,every方法將會立即返回false。否則,callback為每一個元素返回true,every就會返回true。

語法:arr.every(callback[, thisArg])

2.4、filter()

filter()函數,它利用指定的函數確定是否在返回的數組中包含某一項,數組中的每個元素調用一次提供的函數,

然后構造一個所有值的新數組,也就是會過濾出符合條件的項。

語法:var newArray = arr .filter(callback [,thisArg ])

2.5、map()

map()方法創建一個新數組,其結果是該數組中的每個元素都調用一個提供的函數后返回的結果。

map方法會給原數組中的每個元素都按順序調用一次callback函數。

callback每次執行后的返回值(包括undefined)組合起來形成一個新數組。

語法:let new_array = arr.map(function callback(currentValue, index, array) {// Return element for new_array}[, thisArg])

2.6、forEach()

forEach方法按升序為數組中含有效值的每一項執行一次callback函數。與for循環一樣。

語法:array.forEach(callback(currentValue, index, array){//do something}, this)

array.forEach(callback[, thisArg])

3.常見問題

every()、filter()、some()、map()、forEach()的用法?

4 解決方案

4.1、map()方法創建一個新數組,其結果是該數組中的每個元素都調用一個提供的函數后返回的結果。例如下面例子:map方法會對數組每一項運行函數,再返回新的數組。

varnumbers=[1,4,9];

vardoubles=numbers.map(function(num){returnnum*2;});

// doubles數組的值為: [2, 8, 18]

// numbers數組未被修改: [1, 4, 9]

4.2、every方法為數組中的每個元素執行一次callback函數,直到它找到一個使callback返回false(表示可轉換為布爾值false的值)的元素。如果發現了一個這樣的元素,every方法將會立即返回false。否則,callback為每一個元素返回true,every就會返回true。

例如下面例子:只有全部大于十才會返回true,當有一個小于十就會返回false。

functionisBigEnough(element,index,array){return(element>=10);}

varpassed=[12,5,8,130,44].every(isBigEnough);? ? // passed is false

passed=[12,54,18,130,44].every(isBigEnough);? ? ?// passed is true

4.3、some方法和every方法相對,只要有一個返回true,some方法就會返回true

例如下面例子:當數組項全部小于10 some方法就會返回false,當數組項有一個大于10返回true。

functionisBiggerThan10(element,index,array){returnelement>10;}[2,5,8,1,4].some(isBiggerThan10);? ?// false

[12,5,8,1,4].some(isBiggerThan10);? ?// true

4.4、filter方法返執行會調函數后的數組

下面例子數組的元素由原數組中值大于 10 的元素組成:

functionisBigEnough(element){returnelement>=10;}

varfiltered=[12,5,8,130,44].filter(isBigEnough);

// filtered is [12, 130, 44]

4.5、forEach方法與for循環一樣,按升序為數組中含有效值的每一項執行一次callback函數

constarr=['a','b','c'];

arr.forEach(function(element){console.log(element);});

// a

// b

// c


7.參考文獻

參考1:javascript高級程序設計

參考2:MDN web技術文檔https://developer.mozilla.org/zh-CN/docs/Web

參考3:js數組操作--使用迭代方法替代for循環


1、什么是迭代?

迭代(iterate),指的是按照某種順序逐個訪問列表中的每一項。比如,for語句。

2、map()和forEach()有什么區別

map()方法創建一個新數組,其結果是該數組中的每個元素都調用一個提供的函數后返回的結果。

forEach方法與for循環一樣,按升序為數組中含有效值的每一項執行一次callback函數。其實都是對數組每一項執行方法,區別是map()會返回結果數組,forEach()不反回數組。


3、forEach()方法與for循環有什么區別?

本質上沒有區別,只是寫法不同而已。都是按升序為數組中含有效值的每一項執行一次callback函數


(&&&歡迎交流-----812271639)

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容