你在哪?

总结JS中查找元素的相关方法

先来看一个例子,这四个方法均为Array对象的原型方法

1
2
3
4
5
6
7
8
9
var arr = [1,2,3,2]
arr.find((e) => e % 2 == 0)
// 2
arr.findIndex((e) => e % 2 == 0)
// 1
arr.indexOf(2)
// 1
arr.includes(2)
// true

find()

ES6规范中加入

find中的回调函数中会传入三个参数,分别为element、index和array

对数组中每个元素都会执行回调函数,直到返回真值,若找到这样的元素,则返回元素值,否则返回undefined

1
2
3
4
5
6
7
8
9
10
var arr = [1,2,3]
arr.find((element,index,array) => {console.log(`${element}-${index}-${array}`)})
// undefined
// 1-0-1,2,3
// 2-1-1,2,3
// 3-2-1,2,3
arr.find((e) => e > 2 )
// 3
arr.find((e) => e % 2 != 0)
// 1

findIndex()

ES6规范中加入

findIndex回调函数的参数与find相同

对数组中每个元素都会执行回调函数,直到返回真值,若找到这样的元素,则返回元素的索引,否则返回-1

1
2
3
4
5
var arr = [1,2,3]
arr.findIndex((e) => e > 2 )
// 2
arr.findIndex((e) => e % 2 != 0)
// 0

indexOf()

ES5规范中加入

indexOf(element[…fromIndex])

  • 第一个参数为需要查找的元素
  • 第二个参数为查找的起始索引位置,可选。如果该索引值大于或等于数组长度,意味着不会在数组里查找,返回-1。如果参数中提供的索引值是一个负值,则取计算array.lenth + fromIndex后的位置

返回在数组中可以找到一个给定元素的第一个索引,如果不存在,则返回-1

1
2
3
4
5
6
7
8
9
var arr = [2, 9, 7, 8, 9]
arr.indexOf(9)
// 1
arr.indexOf(9, 2)
// 4
arr.indexOf(9, 10)
// -1
arr.indexOf(9, -2)
// 4

includes()

ES6规范中加入

判断一个数组是否包含一个指定的值,根据满足条件返回true 或 false

参数个数与设置与indexOf的情况基本相同,其中如果该索引值大于或等于数组长度,意味着不会在数组里查找,返回false

1
2
3
4
5
6
7
8
9
var arr = [2, 9, 7, 8, 9]
arr.includes(9)
// true
arr.includes(9, 2)
// true
arr.includes(9, 10)
// false
arr.includes(9, -2)
// true
文章目录
  1. 1. find()
  2. 2. findIndex()
  3. 3. indexOf()
  4. 4. includes()
|