一糖声、常見數(shù)組過濾
有一個數(shù)組抽莱，如下：
var data = [
{id:1, name:aaa},
{id:2, name:bbb},
{id:3, name:ccc},
{id:4, name:ddd},
{id:5, name:eee}
];
現(xiàn)在要找出id 大于 2的數(shù)據(jù),我們就會想到：
function f1(arr) {
var newArr = [];
for(var i = 0; i < arr.length; i++){
if(arr[i]['id'] > 2) {
newArr.push(arr[i]);
}
}
return newArr;
}
var newData = f1(data); // 使用f1
// 如果我們要加多一個條件：要name 以 字母c開頭呢，我們又要去循環(huán)過濾一遍纸型。拇砰。
function f2(arr) {
var newArr=[];
for(var i=0; i < arr.length; i++){
if( arr[i]['name'] === 'c') {
newArr.push(arr[i]);
}
}
return newArr
}
newData = f2(newData)
可以發(fā)現(xiàn)這樣比較麻煩， 現(xiàn)在 我們可以使用Array.filter()這個高階函數(shù)去做這些事狰腌，兼容ie9
同樣是上面兩個條件我們可以這樣寫：
var newData1 = data.filter(function(item){
// item 等同于 上面循環(huán)中的 arr[i]
// 只有 字母c開頭且 id 大于2的數(shù)據(jù)會被選中除破，一個條語句就搞定
return (item['id'] > 2 && item['name'][0] === 'c')
});
那么 filter函數(shù) 是如何做到的呢？其實琼腔，filter就是對上面的f1函數(shù)做了一層封裝而已瑰枫，讓我們來拆開它的包裝：
我們定義一個函數(shù)叫 arrayFilter ,它接收兩個參數(shù)，一個是要過濾的數(shù)組arr丹莲，一個是過濾函數(shù)fn
function arrayFilter(arr, fn) {
var newArr = [];
for(var i = 0; i < arr.length; i++ ){
if(fn(arr[i]) === true) { // 關鍵點在這里
newArr.push(arr[i]);
}
}
return newArr
}
// 使用 arrayFilter：
arrayFilter(arr,function(item){
return(item['id'] > 2 && item['name'][0] === 'c')
})
arrayFilter 這樣子基本就實現(xiàn)filter功能了光坝。但是呢,看看我們的高階函數(shù)是這樣子的：
Array.filter(function(){...});
而不是:
arrayFilter(Array,function(){...})
那么怎么樣去把 arrayFilter(Array,function(){...}) 中的參數(shù)Array 提出到外面去呢？甥材，我們更喜歡這樣用：
Array.arrayFilter(function(){...})
最簡單的做法就是把arrayFilter 掛到js數(shù)組對象的原型prototype上面去盯另，即：
Array.prototype.arrayFilter = function(fn) {
var newArr = [];
var _this = this;
for(var i = 0; i < _this .length; i++) {
if(fn(_this [i]) === true) {
newArr.push(_this [i]);
}
}
return newArr
}
這樣以后任何數(shù)組a都可以直接調用 arrayFilter 這個方法了，即 a.arrayFilter 等于 a.filter洲赵，這樣鸳惯，一個filter方法就是這樣產生了，不過原生的filter是接收三個參數(shù)的叠萍，我這里的arrayFilter只是簡單的實現(xiàn)了過濾功能芝发。
