Question

我是JS的新手，正在尝试学习如何在JS中正确使用indexOf，也就是说，如果您看下面的代码：

var sandwiches = ['turkey', 'ham', 'turkey', 'tuna', 'pb&j', 'ham', 'turkey', 'tuna'];

var deduped = sandwiches.filter(function (sandwich, index) {
    return sandwiches.indexOf(sandwich) === index;
});

// Logs ["turkey", "ham", "tuna", "pb&j"]
console.log(deduped);

我正在尝试删除重复项，但想问两个问题。首先，在这里返回sandwichs.indexOf（sandwich）=== index;为什么我们需要使用“ == index;”。其次，由于indexOf返回索引，如0、1或2 ...那么为什么当我们console.log（deduped）时，我们得到的是名称数组而不是索引数组。希望你明白我的观点

Answer 1

您使用的是filter的Javascript Array方法，该方法采用一个返回布尔值的函数。

函数filter根据传递给每个条目的函数返回一个新的数组。

如果函数返回true，则该条目将包含在新Array中，否则将被丢弃。

当函数检查条目的indexOf为当前索引时，该条目的首次出现为true。

所有重复项都将使表达式失败，因为它们不是indexOf找到的第一个索引，因此将其丢弃。

Answer 2

由于逻辑是从阵列中删除重复项，在您的示例中，您将“土耳其”作为重复项。 “土耳其”存在于位置0、2、6 因此，每当您调用indexOf（“ turkey”）时始终返回0，因为indexOf函数返回子字符串的首次出现。因此，对于位置2和6中的元素，条件将失败。那么它将不会返回该元素。
这就是过滤器在javascript中的工作方式。它评估条件并返回true或false，指示是否要在新数组中包含元素，在您的示例中，条件是return sandwiches.indexOf(sandwich) === index;

Answer 3

如果您使用箭头符号，也许基本逻辑一目了然。

order_id

关键点是conversations返回order_id的第一次出现的索引。对于这种情况，比较结果为true，因此该元素将被过滤器保留。对于任何后续事件，比较将为false，过滤器将拒绝它。

Answer 4

===（身份）和==（相等）之间的差异：如果比较值的类型不同，则===将返回false，而==将返回false尝试将值转换为相同的类型。因此，在将某些值与已知类型进行比较的情况下，最好使用===。（http://www.c-point.com/javascript_tutorial/jsgrpComparison.htm）
您将得到一个名称数组而不是索引数组，因为Array.filter不会更改值，而只会过滤它们。您的情况下，过滤器功能为return sandwiches.indexOf(sandwich) === index;，该函数返回true或false。如果要在重复数据删除后获取项目的索引，请在过滤器后使用map：

a.filter(...).map(function(item, idx) {return idx;})

Answer 5

@Dikens，indexOf给出元素的索引（如果找到）。如果找不到该元素，则返回-1。

在您的情况下，您正在过滤数组并将值存储在deduped中。这就是为什么它显示一个数组。

如果在过滤器函数中管理indexOf，则它将记录该元素的索引。

例如：

var deduped = sandwiches.filter(function (sandwich, index) {
   console.log(sandwiches.indexOf(sandwich));
   return sandwiches.indexOf(sandwich) === index;
});

与indexOf在JS中的工作方式混淆

5 个答案: