JavaScript中的indexOf()方法

JavaScript中的indexOf()方法

字符串(String)中的indexOf()方法

  • 语法

1
2
indexOf(searchString)
indexOf(searchString,position)
  • 参数

  1. searchString(必需),字符串类型,为要搜索的字符串。

注意被查找的字符串区分大小写。

假如没有提供该参数,searchString会被强制设置为"undefined"字符串,然后再当前字符串中查找这个值。

  1. position(可选),整数类型,即开始查找的地方,你也可以理解为类似数组中的下标。

若不提供参数,默认从0开始。

若提供的position的值小于0则默认从0开始查找。若提供的position的值大于原来字符串的长度,则该方法不搜索传入的searchString字符串,返回-1

如果参数中提供的索引值是一个负值,则整个字符串都将会被查询。

  • 返回值

该方法会返回查找字符串searchString的第一次出现的索引,如果没有找到,则返回-1

  • 注意当查找字符串是空字符串

若被查找的字符串searchString是一个空字符串,则返回position

1
2
3
'hello world'.indexOf('', 0) // 返回 0 查找的字符串searchString是一个空字符串,则返回position
'hello world'.indexOf('', 3) // 返回 3 查找的字符串searchString是一个空字符串,则返回position
'hello world'.indexOf('', 8) // 返回 8 查找的字符串searchString是一个空字符串,则返回position

​ 如果position值为空,或者position值小于被查找的字符串的长度,返回值和以下的position值一样。

1
2
3
'hello world'.indexOf('') // 返回 0 查找的字符串position值为空,则返回position
'hello world'.indexOf('', 1) // 返回 1 position的值小于字符串的长度11,则返回position
'hello world'.indexOf('', 2) // 返回 2 position的值小于字符串的长度11,则返回position

​ 如果position值大于等于字符串的长度,将会直接返回字符串的长度。

1
2
3
 'hello world'.indexOf('', 11) // 返回 11 position的值大于字符串的长度11,则返回字符串长度11
'hello world'.indexOf('', 13) // 返回 11 position的值大于字符串的长度11,则返回字符串长度11
'hello world'.indexOf('', 22) // 返回 11 position的值大于字符串的长度11,则返回字符串长度11
  • 常用场景

检测是否存在某字符串。

​ 当检查字符串中是否出现特定的子字符串时,正确的检查方法是测试返回值是否为 -1

1
2
'Blue Whale'.indexOf('Blue') !== -1  // true; found 'Blue' in 'Blue Whale'
'Blue Whale'.indexOf('Bloe') !== -1 // false; no 'Bloe' in 'Blue Whale'

使用 indexOf() 统计一个字符串中某个字母出现的次数

​ 在下例中,使用 count 来记录字母 e 在字符串 str 中出现的次数:

1
2
3
4
5
6
7
8
9
10
11
// 翻译:生存还是毁灭?这是个问题。(莎士比亚《哈姆雷特》)
const str = 'To be, or not to be, that is the question.';
let count = 0;
let position = str.indexOf('e');

while (position !== -1) {
count++;
position = str.indexOf('e', position + 1);
}

console.log(count); // displays 4

数组(Array)中的indexOf()方法

  • 语法

1
2
indexOf(searchElement)
indexOf(searchElement, fromIndex)
  • 参数

  1. searchElement(必需),需要查找的元素,类型不固定。

  2. fromIndex(可选),整数类型,开始查找的位置,数组中的下标。

若不提供参数,默认从0开始。

​ 开始查找的位置。如果该索引值大于或等于数组长度,意味着不会在数组里查找,返回 -1。

​ 如果参数中提供的索引值是一个负值,则将其作为数组末尾的一个抵消,即 -1 表示从最后一个元素开始查找,-2 表示从倒数第 二个元素开始查找,以此类推。

  注意:如果参数中提供的索引值是一个负值,并不改变其查找顺序,查找顺序仍然是从前向后查询数组。如果抵消后的索引值仍       小于 0,则整个数组都将会被查询。其默认值为 0。
  • 返回值

​ 首个被找到的元素在数组中的索引位置; 若没有找到则返回 -1

​ 注意:不提供searchElement该参数,或者提供空字符串,返回值都为-1。

  • 常用场景

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

1
2
3
4
5
6
7
8
9
10
const indices = [];
const array = ['a', 'b', 'a', 'c', 'a', 'd'];
const element = 'a';
let idx = array.indexOf(element);
while (idx !== -1) {
indices.push(idx);
idx = array.indexOf(element, idx + 1);
}
console.log(indices);
// [0, 2, 4]

判断一个元素是否在数组里,不在则更新数组

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function updateVegetablesCollection (veggies, veggie) {
if (veggies.indexOf(veggie) === -1) {
veggies.push(veggie);
console.log(`New veggies collection is: ${veggies}`);
} else {
console.log(`${veggie} already exists in the veggies collection.`);
}
}

const veggies = ['potato', 'tomato', 'chillies', 'green-pepper'];

updateVegetablesCollection(veggies, 'spinach');
// New veggies collection is: potato,tomato,chillies,green-pepper,spinach
updateVegetablesCollection(veggies, 'spinach');
// spinach already exists in the veggies collection.

字符串中的indexOf()方法与数组中的indexOf()方法的相同点和不同点

相同点

  • 都是用来查找某一元素的
  • 都有两个参数,要查找的元素,开始查找的位置
  • 查找字符串时严格区分大小写

不同点

  • 传要查找参数时,字符串的indexOf()方法会把不是字符串的参数,类型转换为字符串类型,数组不会。
  • 传入起始查找的参数时,字符串的参数不支持负数。数组支持负数,传负数时,会从最后一个元素下标开始抵消。
  • 返回值在某些情况下有所不同,字符串searchString参数为空字符串时,可能有多种返回结果。

欢迎关注我的其它发布渠道