JS 判断数组是否包含某个元素方法集合

本文详细介绍JavaScript及jQuery中用于数组和字符串查找的多种方法,包括indexOf(), inArray(), find(), findIndex(),以及for循环和if判断的传统方式。每种方法均有详细解释和使用示例。

1、JavaScript indexOf() 方法

  • 定义和用法
    indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。
  • 语法
stringObject.indexOf(searchvalue,fromindex)
参数描述
searchvalue必需。规定需检索的字符串值。
fromindex可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数,则将从字符串的首字符开始检索。
  • 说明
    该方法将从头到尾地检索字符串 stringObject,看它是否含有子串 searchvalue。开始检索的位置在字符串的 fromindex 处或字符串的开头(没有指定 fromindex 时)。如果找到一个 searchvalue,则返回 searchvalue 的第一次出现的位置。stringObject 中的字符位置是从 0 开始的。
  • 提示和注释
    注释:indexOf() 方法对大小写敏感!
    注释:如果要检索的字符串值没有出现,则该方法返回 -1。

2、jQuery.inArray()方法

  • 定义和用法
    $.inArray() 函数用于在数组中查找指定值,并返回它的索引值(如果没有找到,则返回-1
    提示:源数组不会受到影响,过滤结果只反映在返回的结果数组中。
  • 语法
$.inArray( value, array [, fromIndex ] )
参数描述
value任意类型 用于查找的值。
arrayArray类型 指定被查找的数组。
fromIndex可选。Number类型 指定从数组的指定索引位置开始查找,默认为 0

3、JavaScript find() 方法

  • 定义和用法
    find() 方法返回通过测试(函数内判断)的数组的第一个元素的值。
    find() 方法为数组中的每个元素都调用一次函数执行:

    当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素,之后的值不会再调用执行函数。
    如果没有符合条件的元素返回 undefined

    注意:find() 对于空数组,函数是不会执行的。
    注意:find() 并没有改变数组的原始值。
    注意:JavaScript 版本为ECMAScript 6

  • 用法

 array.find(function(currentValue, index, arr),thisValue)
参数描述
function必需。数组每个元素需要执行的函数。
currentValue必需。当前元素 函数参数
index可选。当前元素的索引值函数参数
arr可选。当前元素所属的数组对象函数参数
thisValue可选。 传递给函数的值一般用 “this” 值。如果这个参数为空, “undefined” 会传递给 “this” 值
  • 返回值
    返回符合测试条件的第一个数组元素值,如果没有符合条件的则返回 undefined

4、JavaScript findIndex() 方法

  • 定义和用法
    findIndex() 方法返回传入一个测试条件(函数)符合条件的数组第一个元素位置。
    findIndex() 方法为数组中的每个元素都调用一次函数执行:

    当数组中的元素在测试条件时返回 true 时, findIndex() 返回符合条件的元素的索引位置,之后的值不会再调用执行函数。
    如果没有符合条件的元素返回 -1

    注意:find() 对于空数组,函数是不会执行的。
    注意:find() 并没有改变数组的原始值。
    注意:JavaScript 版本为ECMAScript 6

  • 用法

array.findIndex(function(currentValue, index, arr), thisValue)
参数描述
function必需。数组每个元素需要执行的函数。
currentValue必需。当前元素 函数参数
index可选。当前元素的索引值函数参数
arr可选。当前元素所属的数组对象函数参数
thisValue可选。 传递给函数的值一般用 “this” 值。如果这个参数为空, “undefined” 会传递给 “this” 值
  • 返回值
    返回符合测试条件的第一个数组元素索引,如果没有符合条件的则返回 -1

5、for 循环和 if 判断

var arr = [1, 5, 10, 15];

/* 传统for */
for(let i=0; i<arr.length; i++) {
    if(arr[i] === 查找值) {
        //则包含该元素
    }
}

/* for...of */
for(v of arr) {
    if(v === 查找值) {
        //则包含该元素
    }
}

/* forEach */
arr.forEach(v=>{
    if(v === 查找值) {
        //则包含该元素
    }
})
在 JavaScript 中,判断数组是否包含某个特定元素有多种方法。以下是几种常见的方式,并附有代码示例和相关说明: ### 方法一:使用 `includes()` `includes()` 方法用于判断数组是否包含指定的元素,返回值为布尔类型(`true` 或 `false`)。 ```javascript const array = [1, 2, 3, 4, 5]; console.log(array.includes(3)); // true console.log(array.includes(6)); // false ``` 此方法简洁且直观,是推荐的首选方法[^2]。 --- ### 方法二:使用 `indexOf()` `indexOf()` 方法通过查找元素数组中的索引位置判断是否存在。如果元素存在,返回值为非负整数;否则返回 `-1`。 ```javascript const array = [1, 2, 3]; console.log(array.indexOf(2) !== -1); // true console.log(array.indexOf(4) !== -1); // false ``` 此方法适用于旧版 JavaScript,但可读性不如 `includes()`[^1]。 --- ### 方法三:使用 `some()` `some()` 方法通过回调函数检查数组是否存在至少一个符合条件的元素。 ```javascript const array = [1, 2, 3, 4, 5]; console.log(array.some(item => item === 3)); // true console.log(array.some(item => item === 6)); // false ``` 这种方法适合需要复杂条件判断的场景[^2]。 --- ### 方法四:使用 `filter()` `filter()` 方法通过筛选数组中符合条件的元素生成新数组,并检查其长度是否大于 0。 ```javascript const array = [1, 2, 3]; console.log(array.filter(item => item === 2).length > 0); // true console.log(array.filter(item => item === 4).length > 0); // false ``` 此方法适用于需要获取所有匹配元素的情况。 --- ### 方法五:使用 `every()` `every()` 方法用于检查数组中的所有元素是否都满足某个条件。虽然不常用于检查是否包含某个元素,但在特定场景下可以使用。 ```javascript function containsElement(arr, element) { return arr.every(item => item !== element) === false; } const array = [1, 2, 3, 4, 5]; console.log(containsElement(array, 3)); // true console.log(containsElement(array, 6)); // false ``` 此方法更适合检查所有元素是否满足条件。 --- ### 方法六:使用 `for` 循环遍历 手动使用 `for` 循环遍历数组并检查每个元素是否匹配目标值。 ```javascript function containsElement(arr, target) { for (var i = 0; i < arr.length; i++) { if (arr[i] === target) { return true; } } return false; } const array = [1, 2, 3]; console.log(containsElement(array, 2)); // true console.log(containsElement(array, 4)); // false ``` 此方法较为基础,但适用于需要完全控制逻辑的场景[^3]。 --- ### 方法七:使用 `find()` `find()` 方法通过回调函数查找第一个符合条件的元素,返回值为该元素或 `undefined`。 ```javascript const array = [1, 2, 3]; console.log(array.find(item => item === 2) !== undefined); // true console.log(array.find(item => item === 4) !== undefined); // false ``` 此方法适合需要获取匹配元素的场景[^2]。 --- ### 方法八:使用 `Set` 和 `has()` `Set` 是一种集合数据结构,其 `has()` 方法可用于检查集合是否包含某个元素。 ```javascript const array = [1, 2, 3]; const set = new Set(array); console.log(set.has(2)); // true console.log(set.has(4)); // false ``` 此方法效率高,适合需要频繁检查数组是否包含元素的场景。 --- ### 方法九:使用 `reduce()` `reduce()` 方法通过累积器逐步检查数组元素是否包含目标值。 ```javascript const array = [1, 2, 3]; const containsElement = array.reduce((acc, item) => acc || item === 2, false); console.log(containsElement); // true ``` 此方法灵活性高,但代码可读性较差。 --- ### 方法十:使用 `includes()` 的替代方案 在不支持 `includes()` 的环境中,可以结合 `indexOf()` 实现类似功能。 ```javascript const array = [1, 2, 3]; console.log(array.indexOf(2) !== -1); // true console.log(array.indexOf(4) !== -1); // false ``` 此方法适合兼容旧环境。 --- ### 总结 - **推荐首选**:`includes()` 是最简单且直观的方法。 - **兼容性考虑**:`indexOf()` 和 `for` 循环适合旧环境。 - **复杂条件判断**:`some()` 和 `find()` 更灵活。 - **获取匹配元素**:`filter()` 和 `find()` 更适合。 - **检查所有元素**:`every()` 更适合。 ---
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

dadeity

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值