检查 JS 数组是否包含特定值

Question

给定一个 JavaScript 数组 ，您可以使用两种内置数组方法来确定数组是否包含给定元素。 假设您有一个包含 3 个元素的简单数组：

const arr = ['A', 'B', 'C'];

确定是否 arr 包含字符串 'B'， 您可以使用 Array#includes() 或者 Array#indexOf().

includes()

这 Array#includes() 函数是 在 ECMAScript 2016 中引入的 。 它需要一个参数 valueToFind，并返回 true 如果数组中的某个元素等于 valueToFind。

const arr = ['A', 'B', 'C'];

arr.includes('B'); // true
arr.includes('D'); // false

这 Array#includes() 函数使用与 === 运算符（无类型强制），除了 NaN，Array#includes() 函数会发现 NaN 在一个数组中。 这种相等检查的技术术语是 sameValueZero。

// Array contains 1 element, 'NaN'
const arr = [parseInt('foo')];

arr.includes(parseInt('foo')); // true
arr.includes(NaN); // true
arr.includes(Number.NaN); // true

// The `===` operator has some quirks with NaN. `Array#includes()`
// smooths out those rough edges.
arr[0] === NaN; // false
arr[0] === Number.NaN; // false

indexOf()

这 Array#indexOf() 函数 是一种常见的替代方法 includes()， 这 indexOf() 函数返回它找到的数组中的第一个索引 valueToFind， 或者 -1 否则。

const arr = ['A', 'B', 'C'];

arr.indexOf('A'); // 0
arr.indexOf('B'); // 1
arr.indexOf('D'); // -1

// To check whether an array contains a given value, you should use the
// below check.
arr.indexOf('D') !== -1; // false

检查是否 arr 包含 v，你会使用 arr.indexOf(v) !== -1，在某些代码库中，您可能会看到 ~arr.indexOf(v) 相反，在哪里 ~ 是 JavaScript 按位 NOT 运算符 。

给定一个整数 v, ~v === -(v + 1)， 所以 ~v === 0 除非 v === -1，这是避免写出的一个方便的技巧 !== -1。
但是，使用按位 NOT 通常是不好的做法，因为它会牺牲可读性来保存 4 个字符。

const arr = ['A', 'B', 'C'];

if (~arr.indexOf('A')) {
  // Runs
}
if (~arr.indexOf('D')) {
  // Does not run
}

不像 Array#includes(), Array#indexOf() 使用与 === 运算符来检查是否相等。 换句话说， Array#indexOf() 找不到 NaN 在一个数组中。

// Array contains 1 element, 'NaN'
const arr = [parseInt('foo')];

arr.indexOf(NaN); // -1
arr.indexOf(Number.NaN); // -1

Array#includes() 通常是更好的选择，因为您不需要输入 !== -1 并且因为它具有更好的相等语义。 但是由于 Array#includes() 在 ES2016 中引入， 的任何版本的 Internet Explorer 或 Node.js 版本中均不支持。 如果你使用 Array#includes()，请确保 为旧浏览器添加 polyfill 。