簡述forEach()、map()、filter()、every()、some()的用法
1.forEach()
用於遍歷陣列,無返回值。
var arr = [1,-2,3,4,-5];
arr.forEach(function(item,index,array){
array[index] = item * 2;
});
console.log(arr); // [2,-4,6,8,-10]
可以看到,forEach()可以傳入一個匿名函式作為引數,而該匿名函式有含有三個引數,其依次代表陣列遍歷時的當前元素item,陣列遍歷時的當前元素的索引index,以及正在遍歷的陣列array。有了這三個引數,可以方便我們做很多事情,比如說示例當中將每一項陣列元素翻倍,這時需要用到第一個引數item。但是,僅僅只是將item乘以2可不行,我們還得將其賦值給原來的陣列,這時我們就得用到後面兩個引數index和array。
根據上述可知,array[index]是全等於item的。
arr.forEach(function(item,index,array){
console.log(array[index] === item); // true
});
2.map()
用於遍歷陣列,返回處理之後的新陣列,處理陣列後不會影響到原有陣列。
var arr = [1,-2,3,4,-5];
var newArr = arr.map(function(item,index,array){
return item * 2;
});
console.log(newArr); // [2,-4,6,8,-10]
3.filter()
用於篩選陣列中滿足條件的元素,返回一個篩選後的新陣列,不會影響到原有陣列。
var arr = [1,-2,3,4,-5];
var minus = arr.filter(function(item,index,array){
return item < 0;
});
console.log(minus); // [-2, -5]
4.every()
用於判斷陣列中的每一項元素是否都滿足條件,返回一個布林值。
var arr = [1,-2,3,4,-5];
var isEvery = arr.every(function(item,index,array){
return item > 0;
});
console.log(isEvery); // false
5.some()
用於判斷陣列中的是否存在滿足條件的元素,返回一個布林值。
var arr = [1,-2,3,4,-5];
var isSome = arr.some(function(item,index,array){
return item < 0;
});
console.log(isSome); // true
補充
以上五大方法除了傳遞一個匿名函式作為引數之外,還可以傳第二個引數,該引數用於指定匿名函式內的this指向,例如:
// 只傳一個匿名函式
arr.forEach(function(item,index,array){
console.log(this); // window
});
// 傳兩個引數
arr.forEach(function(item,index,array){
console.log(this); // [1, -2, 3, 4, -5]
},arr);
總結
- forEach()無返回值,map()和filter()返回新陣列,every()和some()返回布林值;
- 匿名函式中this指向預設為window,可通過傳第二引數來更改之;
- 五種遍歷方法均為ES5方法,IE8及其以下瀏覽器均不相容。
相關文章
- 簡述forEach()、map()、every()、some()和filter()的用法Filter
- 陣列的forEach,map,filter,reduce,reduceRight,every,some方法陣列Filter
- JS中some、every、map、filterJSFilter
- 一張圖看懂JavaScript中陣列的迭代方法:forEach、map、filter、reduce、every、someJavaScript陣列Filter
- JS中陣列遍歷方法foreach,filter,some,every,map方法介紹與總結JS陣列Filter
- forEach、map、filter、find、sort、some等易錯點整理Filter
- JavaScript 中 forEach、map、filter 詳細JavaScriptFilter
- es6 map、foreach、reduce、 filter 詳解Filter
- 遍歷陣列的常用方法forEach,filter,map等陣列Filter
- 陣列的 map, filter ,sort和 reduce 用法陣列Filter
- forEach、map、filter、find、sort、find等易錯點整理Filter
- JavaScript 4/30: 陣列的 map, filter 和 reduce 用法JavaScript陣列Filter
- javascript forEach無法break,使用every代替JavaScript
- python之高階函式map,reduce,filter用法Python函式Filter
- Go 通過 Map/Filter/ForEach 等流式 API 高效處理資料GoFilterAPI
- jQuery filter() 用法簡單介紹jQueryFilter
- JavaScript的map迴圈、forEach迴圈、filter迴圈、reduce迴圈、reduceRight迴圈JavaScriptFilter
- [譯]在 JavaScript 中 為什麼你應當使用 map 和 filter 來替代 forEachJavaScriptFilter
- PHP中關於foreach的簡單的用法總結PHP
- kotlin之plus、copyOf、reverse、forEach、filter、map、reduce、fold等函式解釋和使用KotlinFilter函式
- PHP用foreach來表達array_walk/array_filter/array_map/array_reducePHPFilter
- java中filter的用法JavaFilter
- for、for...in、for...of、forEach和map的區別
- JavaScript中Map和ForEach的區別JavaScript
- js迴圈(for/for in/forEach/map/for of)詳解JS
- javascript陣列的map()函式用法簡單介紹JavaScript陣列函式
- python 中的map,dict,lambda,reduce,filterPythonFilter
- Python map, reduce, filter和sortedPythonFilter
- c++ map用法C++
- map、reduce、filter、for...of、for...in等總結Filter
- php array_filter() 函式的用法PHPFilter函式
- JavaScript every()JavaScript
- AngularJS Filter用法詳解AngularJSFilter
- React中兩種遍歷資料的方法(map、forEach)React
- STL:map用法總結
- jQuery map和each用法jQuery
- python-python的sao操作 map reduce filterPythonFilter
- Python中map filter reduce的遞迴實現PythonFilter遞迴