js 数组filter|极客笔记

js 数组filter

在JavaScript中，filter() 是数组对象的一个方法，用于过滤数组中的元素，返回一个新的数组。在使用filter()方法时，需要传入一个回调函数，这个回调函数会对数组中的每一个元素进行判断，如果返回true，则将该元素添加到新数组中，否则不添加。

语法

filter() 方法的语法如下：

const newArray = array.filter(callback(element[, index[, array]])[, thisArg])

callback: 回调函数，用来判断数组中的每一个元素是否满足条件
- element: 数组中正在处理的当前元素
- index (可选): 数组中正在处理的当前元素的索引
- array (可选): 调用 filter() 方法的数组
thisArg (可选): 回调函数中的 this 值

示例

假设我们有一个数字数组，我们希望过滤出所有小于10的数字，可以使用filter()方法来实现：

const numbers = [5, 12, 8, 25, 3];

const filteredNumbers = numbers.filter(function(num) {
  return num < 10;
});

console.log(filteredNumbers); // [5, 8, 3]

在上面的示例中，我们定义了一个数字数组numbers，然后使用filter()方法来过滤出小于10的数字，最终得到的filteredNumbers数组为[5, 8, 3]。

使用箭头函数

在上面的示例中，我们使用了普通的函数来作为filter()方法的回调函数。在ES6中，我们还可以使用箭头函数来简化代码。上面的示例可以改写为：

const numbers = [5, 12, 8, 25, 3];

const filteredNumbers = numbers.filter(num => num < 10);

console.log(filteredNumbers); // [5, 8, 3]

支持thisArg参数

filter()方法还支持传入第二个参数thisArg，用来指定回调函数中的this值。下面是一个使用thisArg参数的示例：

const data = {
  threshold: 10,
  numbers: [5, 12, 8, 25, 3],
  filterNumbers: function(num) {
    return num < this.threshold;
  }
};

const filteredNumbers = data.numbers.filter(data.filterNumbers, data);

console.log(filteredNumbers); // [5, 8, 3]

在这个示例中，我们定义了一个包含了threshold和numbers属性的data对象，并且定义了一个filterNumbers方法用来判断数字是否小于threshold。然后我们将filterNumbers作为回调函数传入filter()方法，并且通过data对象作为thisArg参数传入，最终得到的结果与之前相同。