Question

我正在使用 JavaScript：权威指南作为Learn JavaScript Properly的一部分，而我在第7章关于数组的部分中对filter()方法的推理有困难方法

以下是提供的示例：

filter()方法返回一个包含子集的数组   调用它的数组的元素。你传递给的功能   它应该是谓词：返回true或false的函数。该   谓词的调用与forEach()和map()一样。如果退货   value为true，或者转换为true的值，然后是元素   传递给谓词的是子集的成员并被添加到   将成为返回值的数组。

示例：

a = [5, 4, 3, 2, 1];
smallvalues = a.filter(function(x) { return x < 3 });   // [2, 1]
everyother = a.filter(function(x,i) { return i%2==0 }); // [5, 3, 1]

我感到困惑的是i行中x的{{1}}应用程度。以下是我认为正在发生的事情：

everyother（i的索引）正在通过函数a[]传递，该函数将谓词应用于x的每个元素并返回{ {1}}。
然后该函数显示“a[]中的过滤器[4, 2]”......我真的很模糊。

当我在控制台乱糟糟的时候，我试过了：

[4, 2]

这是我所期望的，但我不明白当我将上述代码更改为

a[]

（我知道数组方法的应用方式如下：everyother = a.filter(function(i) { return i%2==0 }); // returns [4, 2]）

对于这个特殊的例子，我很明显我可以用另一种方式得到预期的结果：

everyother = a.filter(function(x,i) { return i%2==0 }); // returns [5, 3, 1]

但是我怀疑这种想法正是错过了这个例子试图碰到的点......我只是错过了它。

Answer 1

你的例子非常简单明了：

a = [5, 4, 3, 2, 1];
smallvalues = a.filter(function(x) { return x < 3 });   // [2, 1]
everyother = a.filter(function(x,i) { return i%2==0 }); // [5, 3, 1]

第一个读取：»返回每个元素（x），小于3 «。结果并不令人震惊。

第二个读取：»返回每个元素，其索引（i）是偶数（包括0）«

x 只是被忽略了。

你也可以写[5, 4, 3, 2, 1].filter(function(_,x){return x%2===0})

Array.prototype.filter()见MDN。

Answer 2

当您使用两个参数的函数调用filter时，第一个参数绑定到数组元素值，第二个参数绑定到元素索引。

你的困惑源于输入数组[5,4,3,2,1]有些特殊 - 具有偶数索引（5,3,1）的元素是奇数，而具有奇数索引（4,2）的元素是偶数。

这使得此过滤谓词...%2始终选择相同类型的元素，具体取决于您传递的内容作为谓词参数（值或索引），您将得到奇数或偶数元素。

我清理混乱的建议是选择一个不同的数组来测试你的过滤方法。数组应混合奇数的索引和值，如[1,3,4,5,7,8]。您将立即观察谓词将值或索引考虑在内时会发生什么。

还要记住，在创建过滤谓词时，形式参数的名称是任意的，重要的是它们的位置。无论你怎么称呼它，第一个参数代表值，第二个代表索引。如果您意外地碰撞参数名称，并且调用了第一个参数i，然后调用了第二个参数i，那么它会在两个场景中与其他参数绑定。

Answer 3

a = [5, 4, 3, 2, 1];
everyother = a.filter(function(x,i) { return i%2==0 }); // [5, 3, 1]

x是数组中的每个元素。（第一次迭代x = 5，第二次迭代x = 4，等等......）
我是索引 - （第一次迭代i = 0，第二次迭代i = 1，依此类推......）

因此，在问题中（对于第一次迭代，i％2变为0％2，其等于0并且条件变为真。并且第一个元素返回到数组。然后返回5）。接下来，1％2！= 0，所以4被删除。 2％2 == 0，因此3次停留。（等等......）

在这种语法中： - x每次迭代都有一个值，但它在条件中没有用完。

提示：filter（）总是需要一个布尔值。返回的任何内容（true或false）都会确定值（或元素）是否保留在数组中。

Answer 4

简单...... 在everyother中，i是每个元素的索引，i的唯一可能值是0,1,2,3,4，因为数组中有五个元素。

现在i的所有值中只有0,2,4可以被2整除，这就是为什么你得到这些指数的值，即[5,3,1]。

Answer 5

a = [5, 4, 3, 2, 1];
smallvalues = a.filter(obj => obj < 3); console.log(smallvalues)
everyother = a.filter(ele => ele % 2); console.log(everyother)//

过滤器功能可以很简单，我们可以这样编写；

Answer 6

const state.contactList = [{
name: 'jane',
email: 'jane@gmail.com'
},{},{},...]

const fileredArray = state.contactsList.filter((contactItem) => {
  const regex = new RegExp(`${action.payload}`, 'gi');
  return contactItem.nameProperty.match(regex) || contactItem.emailProperty.match(regex);
});


// contactList: all the contacts stored in state
// action.payload: whatever typed in search field

JavaScript filter（）方法混淆

6 个答案: