filter() 方法创建一个新数组，其中包含通过提供的函数实现的测试的所有元素。
使用 filter 方法从数组中提取数据
另一个有用的数组方法是 filter()（即 Array.prototype.filter()）。
filter 接收一个回调函数，将回调函数内的逻辑应用于数组的每个元素，
新数组包含根据回调函数内条件返回 true 的元素。
换言之，它根据传递给它的函数过滤数组。 和 map 一样，filter 不会改变原始数组。
回调函数接收三个参数。
第一个参数是当前正在被处理的元素。 第二个参数是这个元素的索引，第三个参数是在其上调用 filter 方法的数组。
简单的例子：
1
2
3
4
5
6
7
8
|
const users = [
{ name: 'John', age: 34 },
{ name: 'Amy', age: 20 },
{ name: 'camperCat', age: 10 }
];
const usersUnder30 = users.filter(user => user.age < 30);
console.log(usersUnder30); // [ { name: 'Amy', age: 20 }, { name: 'camperCat', age: 10 } ]
|
复杂的例子：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
// 全局变量
const watchList = [
{
"Title": "Inception",
"Year": "2010",
"imdbRating": "8.8",
},
{
"Title": "Interstellar",
"Year": "2014",
"imdbRating": "8.6",
}
];
const filteredList = watchList
.map(({ Title: title, imdbRating: rating }) => ({ title, rating }))
.filter(({ rating }) => rating > 8);
console.log(filteredList); // [ { title: 'Inception', rating: '8.8' }, { title: 'Interstellar', rating: '8.6' } ]
|
在原型上实现 filter 方法
为了加深对 filter 的理解，可以自己实现一个。 可以用 for 循环或 Array.prototype.forEach()
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
|
// 全局变量
const s = [23, 65, 98, 5];
Array.prototype.myFilter = function(callback) {
const newArray = [];
// for (let i = 0; i < this.length; i++) {
// if (callback(this[i]) === true) {
// newArray.push(this[i]);
// }
// }
this.forEach(function(x) {
if (callback(x) == true) {
newArray.push(x);
}
});
return newArray;
};
const new_s = s.myFilter(function(item) {
return item % 2 === 1;
});
console.log(new_s); // [ 23, 65, 5 ]
|