乐闻世界logo
搜索文章和话题

How do I check if an array includes a value in JavaScript?

9 个月前提问
4 个月前修改
浏览次数61

7个答案

1
2
3
4
5
6
7

在JavaScript中,有几种方法可以检查数组是否包含特定的值。这里是几种常见的方法:

1. includes 方法

从ES6/ECMAScript 2015开始,Array.prototype.includes 方法被引入来检查数组是否包含特定的元素。这个方法返回一个布尔值。

javascript
let fruits = ['apple', 'banana', 'mango', 'orange']; let containsMango = fruits.includes('mango'); // 返回 true let containsCherry = fruits.includes('cherry'); // 返回 false

2. indexOf 方法

在ES6之前,indexOf 方法被广泛用来检查数组中是否存在某个元素。如果数组包含指定的元素,indexOf 方法会返回该元素在数组中的索引(从0开始计数),否则返回-1。

javascript
let fruits = ['apple', 'banana', 'mango', 'orange']; let mangoIndex = fruits.indexOf('mango'); // 返回 2 let containsMango = mangoIndex !== -1; // 如果索引不是-1,则包含mango,返回 true let cherryIndex = fruits.indexOf('cherry'); // 返回 -1 let containsCherry = cherryIndex !== -1; // 返回 false

3. findfindIndex 方法

find 方法用于查找数组中满足提供的测试函数的第一个元素的值。如果没有找到符合条件的元素,则返回undefinedfindIndex 方法与find方法类似,但它返回的是找到的元素的索引,如果没有找到则返回-1。

javascript
let fruits = ['apple', 'banana', 'mango', 'orange']; let containsMango = fruits.find(fruit => fruit === 'mango') !== undefined; // 返回 true let containsCherry = fruits.findIndex(fruit => fruit === 'cherry') !== -1; // 返回 false

4. some 方法

some 方法会测试数组中是不是至少有1个元素通过了被提供的函数测试,返回一个布尔值。

javascript
let fruits = ['apple', 'banana', 'mango', 'orange']; let containsMango = fruits.some(fruit => fruit === 'mango'); // 返回 true let containsCherry = fruits.some(fruit => fruit === 'cherry'); // 返回 false

这些都是检查数组是否包含某个值的有效方法,使用哪一种主要取决于你的具体需求以及你的JavaScript版本兼容性要求。通常,includes方法是最直接和易读的方式,但如果你需要支持旧版浏览器,可能会需要使用indexOf。而findfindIndexsome方法则提供了更多的灵活性,允许你使用函数来确定是否包含某个值。

2024年6月29日 12:07 回复

现代浏览器有Array#includes,它正是_这样_做的,并且得到除 IE 之外的所有人的广泛支持:

shell
console.log(['joe', 'jane', 'mary'].includes('jane')); // true

运行代码片段Hide results

展开片段

您还可以使用Array#indexOf,这不太直接,但不需要针对过时的浏览器进行填充。

shell
console.log(['joe', 'jane', 'mary'].indexOf('jane') >= 0); // true

运行代码片段Hide results

展开片段


许多框架也提供了类似的方法:

请注意,某些框架将其实现为函数,而其他框架则将该函数添加到数组原型中。

2024年6月29日 12:07 回复

2019 年更新:这个答案来自 2008 年(11 岁了!),与现代 JS 的使用无关。承诺的性能改进是基于当时浏览器中完成的基准测试。它可能与现代 JS 执行上下文无关。如果您需要简单的解决方案,请寻找其他答案。如果您需要最佳性能,请在相关执行环境中为自己进行基准测试。

正如其他人所说,通过数组进行迭代可能是最好的方法,但已经证明递减while循环是 JavaScript 中最快的迭代方法。因此,您可能需要按如下方式重写代码:

shell
function contains(a, obj) { var i = a.length; while (i--) { if (a[i] === obj) { return true; } } return false; }

当然,你也可以扩展Array原型:

shell
Array.prototype.contains = function(obj) { var i = this.length; while (i--) { if (this[i] === obj) { return true; } } return false; }

现在您可以简单地使用以下内容:

shell
alert([1, 2, 3].contains(2)); // => true alert([1, 2, 3].contains('2')); // => false
2024年6月29日 12:07 回复

最上面的答案假设原始类型,但如果你想知道一个数组是否包含具有某种特征的对象Array.prototype.some()是一个优雅的解决方案:

shell
const items = [ {a: '1'}, {a: '2'}, {a: '3'} ] items.some(item => item.a === '3') // returns true items.some(item => item.a === '4') // returns false

它的好处是,一旦找到元素,迭代就会中止,从而避免不必要的迭代周期。

此外,它非常适合语句,if因为它返回一个布尔值:

shell
if (items.some(item => item.a === '3')) { // do something }

* 正如 jamess 在评论中指出的那样,在 2018 年 9 月发表此答案时,Array.prototype.some()完全支持:caniuse.com 支持表

2024年6月29日 12:07 回复

indexOf也许吧,但它是“ECMA-262 标准的 JavaScript 扩展;因此它可能不会出现在该标准的其他实现中。”

例子:

shell
[1, 2, 3].indexOf(1) => 0 ["foo", "bar", "baz"].indexOf("bar") => 1 [1, 2, 3].indexOf(4) => -1

AFAICS Microsoft 没有_提供_某种替代方案indexOf,但如果您愿意,您可以在 Internet Explorer(以及其他不支持的浏览器)中向数组添加类似的功能,正如Google 快速搜索显示的那样(例如,这个)。

2024年6月29日 12:07 回复

ECMAScript 7 引入了Array.prototype.includes.

它可以这样使用:

shell
[1, 2, 3].includes(2); // true [1, 2, 3].includes(4); // false

它还接受可选的第二个参数fromIndex

shell
[1, 2, 3].includes(3, 3); // false [1, 2, 3].includes(3, -1); // true

indexOf与使用Strict Equality Comparison不同,includes使用SameValueZero相等算法进行比较。这意味着您可以检测数组是否包含NaN

shell
[1, 2, NaN].includes(NaN); // true

与 不同的是indexOfincludes它不会跳过缺失的索引:

shell
new Array(5).includes(undefined); // true

它可以被填充以使其在所有浏览器上运行。

2024年6月29日 12:07 回复

在 JavaScript 中,你可以使用多种方法来检查数组是否包含特定的值。以下是一些常见的方法:

1. includes 方法

javascript
let array = [1, 2, 3, 4, 5]; let value = 3; if (array.includes(value)) { console.log('数组包含该值'); } else { console.log('数组不包含该值'); }

includes 方法会检查数组中是否存在指定的值,并返回一个布尔值(truefalse)。

2. indexOf 方法

javascript
let array = [1, 2, 3, 4, 5]; let value = 3; if (array.indexOf(value) !== -1) { console.log('数组包含该值'); } else { console.log('数组不包含该值'); }

indexOf 方法会查找数组中指定值的第一个索引,并返回该索引。如果数组不包含该值,则返回 -1

3. find 方法

javascript
let array = [1, 2, 3, 4, 5]; let value = 3; if (array.find(element => element === value) !== undefined) { console.log('数组包含该值'); } else { console.log('数组不包含该值'); }

find 方法会返回数组中满足提供的测试函数的第一个元素的值。如果没有找到满足条件的元素,则返回 undefined

4. some 方法

javascript
let array = [1, 2, 3, 4, 5]; let value = 3; if (array.some(element => element === value)) { console.log('数组包含该值'); } else { console.log('数组不包含该值'); }

some 方法会测试数组中是否至少有一个元素通过了提供的函数测试。返回的是一个布尔值。

注意事项

  • includes 方法不会对数组中的 NaN 值进行区分,即 [NaN].includes(NaN) 会返回 true
  • includesindexOf 方法不会检查数组中的对象引用或嵌套数组是否相等,它们只能用于原始类型的比较。
  • findsome 方法可以通过提供的回调函数来实现更复杂的检查,包括对象的深度比较。

在使用这些方法时,你应该根据你要进行的检查的性质以及目标浏览器是否支持这些方法来选择最合适的。例如,includes 方法在 ES2016 (ES7) 中被引入,不被一些旧的浏览器支持。

2024年6月29日 12:07 回复

你的答案