JavaScript - 检查数组是否包含某个值

有时候我们需要检查一个 JavaScript 数组中是否包含特定的值。这在前端开发中非常常见，例如验证用户输入是否存在于特定选项列表中，或者过滤出符合特定条件的数组元素。

在本文中，我们将介绍几种方法来检查一个数组是否包含某个值，并提供示例代码和指导意义。

1. indexOf() 方法

JavaScript 数组原生提供了 indexOf() 方法，用于返回数组中第一次出现指定元素的索引位置。如果元素不在数组中，则返回 -1。

const arr = [1, 2, 3, 4, 5];

console.log(arr.indexOf(3)); // 2
console.log(arr.indexOf(6)); // -1

利用这个方法，我们可以写一个函数来检查数组中是否包含某个值：

function containsValue(arr, value) {
  return arr.indexOf(value) !== -1;
}

const arr = [1, 2, 3, 4, 5];

console.log(containsValue(arr, 3)); // true
console.log(containsValue(arr, 6)); // false

这个方法的缺点是，它无法检查一个数组中是否包含 NaN，因为 NaN != NaN。如果你需要检查一个数组中是否包含 NaN，可以使用下面介绍的 includes() 方法或自己实现一个循环检查的函数。

2. includes() 方法

ES7 引入了 includes() 方法，用于检查一个数组是否包含指定元素。和 indexOf() 方法不同的是，includes() 方法可以正确地检查一个数组中是否包含 NaN。

const arr = [1, 2, 3, NaN];

console.log(arr.includes(3)); // true
console.log(arr.includes(NaN)); // true
console.log(arr.includes(4)); // false

利用这个方法，我们可以写一个简单的函数来检查数组中是否包含某个值：

function containsValue(arr, value) {
  return arr.includes(value);
}

const arr = [1, 2, 3, 4, 5];

console.log(containsValue(arr, 3)); // true
console.log(containsValue(arr, 6)); // false

3. filter() 方法

另一种方法是使用 filter() 方法，它会返回一个新数组，其中包含所有符合特定条件的元素。

const arr = [1, 2, 3, 4, 5];

const filteredArr = arr.filter((value) => value === 3);

console.log(filteredArr); // [3]

如果筛选出来的新数组长度大于 0，那么原数组就包含特定值。

function containsValue(arr, value) {
  return arr.filter((v) => v === value).length > 0;
}

const arr = [1, 2, 3, 4, 5];

console.log(containsValue(arr, 3)); // true
console.log(containsValue(arr, 6)); // false

结论

以上是几种在 JavaScript 中检查数组是否包含某个值的方法。每种方法都有自己的优缺点，可以根据具体情况选择合适的方法。

综合来看，includes() 方法是最简单、最可读性最高的方法，也是 ES7 引入的新特性，建议首选。如果需要考虑兼容性，可以使用 indexOf() 方法或者自己实现循环检查的函数。

代码示例：https://codepen.io/chatgpt/pen/yLBYzZK

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/28471