JavaScript indexOf方法完全解读

JavaScript 基础 - Array - indexOf()

一. 语法：arr.indexOf(searchElement[, ?fromIndex])

• 参数：

  1. searchElement —— 要查找的元素

  2. ?fromIndex 可选参数 ——开始查找的位置。

• 返回值：找到这个元素 ? 首个被找到的元素在数组中的索引位置 : -1

二. 注意事项：

1. indexOf() 匹配到第一个全等的元素后直接返回索引，中断查找，也就是不返回所有的索引

 
 	[1,2,3,1,1,1].indexOf(1)// 0
  

2. indexOf() 使用 ===判断两个元素（要查找的与数组中被查找的）是否相等；

	[1,2,3].indexOf(1)  // 0
	//  1(数组中被查找的) === 1(要查找的)  

3. indexOf() 中不涉及深层查找；

[123,234,345].indexOf(1)  // -1
	// 不会在每个元素中继续执行indexOf,即不会再 123.indexOf(1)

4. indexOf() 中不涉及隐式类型转换，且判断相等时是两个元素严格全等的；

['123','234','345'].indexOf(123) // -1

5. indexOf()如果索引值传入负数(-n)，就会从倒数第n个开始搜索

[1,2,3,1,1,1].indexOf(1,-7)// 0 n>arr.length  整个数组都将会被查询
[1,2,3,1,1,1].indexOf(1,-1)// 5 从最后一个元素开始搜索
[1,2,3,1,1,1].indexOf(1,-2)// 4 从倒数第二个元素开始搜索

6. indexOf()如果索引值传入大于或等于数组长度，意味着不会在数组里查找，直接返回-1

[1,2,3,1,1,1].indexOf(1,6) // -1  6 == arr.length
[1,2,3,1,1,1].indexOf(1,7) // -1  7 > arr.length

7. indexOf()无法搜索NaN

[1,'1',null,undefined,NaN].indexOf(null)
// 2
[1,'1',null,undefined,NaN].indexOf(undefined)
// 3
[1,'1',null,undefined,NaN].indexOf(NaN)
// -1

8. indexOf()不区分-0，+0

[-0,1].indexOf(+0)
 //0

9. indexOf()在稀疏数组中无法搜索

[,,].indexOf(undefined) 
//-1

三. 应用

1. 找出指定元素出现的所有位置

/**
* @description: 找出指定元素出现的所有位置
* @param {any} ele
* @param {Array} arr
* @return {Array} newArr
*/ 
function searchAllELement(ele,arr){
  let newArr = []
  let idx = arr.indexOf(ele);
  while (idx != -1) {
    newArr.push(idx);
    idx = arr.indexOf(ele, idx + 1);
  }
  return newArr
}
console.log(searchAllELement('a',['a', 'b', 'a', 'c', 'a', 'd']))// [0, 2, 4]

参考：找出指定元素出现的所有位置

2. 判断一个元素是否在数组里，不在则更新数组或者进行其他操作

/**
* @description: 判断一个元素是否在数组里，不在则更新数组或者进行其他操作
* @param {any} key
* @param {Array} data
*/ 
function isUpdateList(data,key){
  data.indexOf(key)=== -1 ? pageReload() : console.log('cancel')
}
function pageReload(){
  console.log('update list')
}
isUpdateList(['123','234','345'],'123')
isUpdateList(['123','234','345'],'133')//

参考：判断一个元素是否在数组里，不在则更新数组

---

参考：

1. MDN文档