JS indexOf方法|极客笔记

JS indexOf方法

1. 概述

在JavaScript中，indexOf()是一个常用的数组方法，用于查找指定元素在数组中的位置，并返回其索引值。如果找到该元素，则返回其首次出现的位置索引；如果未找到该元素，则返回-1。

2. 语法

array.indexOf(searchElement [, fromIndex])

searchElement：需要查找的元素。
fromIndex（可选）：开始查找的位置，默认为0。若该值为负数，则会从数组末尾开始反向查找。

3. 返回值

若找到元素，则返回首次出现的索引位置。
若未找到元素，则返回-1。

4. 示例

以下是一些使用indexOf()方法的示例代码：

示例1：查找数字

const numbers = [1, 2, 3, 4, 5];
const index = numbers.indexOf(3);
console.log(index); // 输出：2

运行结果：2

上述示例中，我们定义了一个包含数字的数组numbers。然后，我们使用indexOf()方法查找数字3在数组中的位置。由于3位于索引2处，所以返回值为2。

示例2：查找字符串

const fruits = ['apple', 'banana', 'orange', 'apple'];
const index = fruits.indexOf('orange');
console.log(index); // 输出：2

运行结果：2

在上述示例中，我们定义了一个包含字符串的数组fruits。我们使用indexOf()方法来查找字符串’orange’在数组中的位置。由于’orange’位于索引2处，所以返回值为2。

示例3：查找元素不存在

const numbers = [1, 2, 3, 4, 5];
const index = numbers.indexOf(10);
console.log(index); // 输出：-1

运行结果：-1

在上述示例中，我们定义了一个包含数字的数组numbers。我们使用indexOf()方法来查找数字10在数组中的位置。由于数组中不存在数字10，所以返回值为-1。

示例4：设置起始位置

const colors = ['red', 'blue', 'green', 'yellow', 'blue', 'purple'];
const index = colors.indexOf('blue', 3);
console.log(index); // 输出：4

运行结果：4

在上述示例中，我们定义了一个包含颜色字符串的数组colors。我们使用indexOf()方法来查找字符串’blue’在数组中的位置，并从索引3开始查找。由于’blue’在数组中首次出现的位置是索引4，所以返回值为4。

5. 注意事项

indexOf()方法区分数据类型，所以查找时需要保持一致。
如果数组中存在多个相同的元素，indexOf()方法只会返回第一个匹配的位置。
兼容性问题：在某些较旧的浏览器中（如IE8），indexOf()方法可能不被支持。在这种情况下，可以使用polyfill（垫片）或其他方法来实现相同的功能：

if (!Array.prototype.indexOf) {
    Array.prototype.indexOf = function(searchElement, fromIndex) {
        var k;
        if (this === null) {
            throw new TypeError('"this" is null or not defined');
        }
        var o = Object(this);
        var len = o.length >>> 0;
        if (len === 0) {
            return -1;
        }
        var n = fromIndex | 0;
        if (n >= len) {
            return -1;
        }
        k = Math.max(n >= 0 ? n : len - Math.abs(n), 0);
        while (k < len) {
            if (k in o && o[k] === searchElement) {
                return k;
            }
            k++;
        }
        return -1;
    };
}