数组的indexOf和findIndex函数之间的区别

Question

我混淆了两个函数indexOf和在数组中查找Index之间的区别.

文件说

findIndex - 返回谓词为true的数组中第一个元素的索引,否则返回-1.

和

indexOf - 返回数组中第一次出现值的索引.

Answer 1

主要区别是这些功能的参数:

• Array.prototype.indexOf()期望将值作为第一个参数.这使得在基本类型的数组(如字符串,数字或布尔值)中查找索引成为一个很好的选择.

• Array.prototype.findIndex()期望回调作为第一个参数.如果您需要具有非基本类型(例如对象)的数组中的索引,或者您的查找条件比仅仅值更复杂,请使用此选项.

有关这两种情况的示例,请参阅链接.

Answer 2

它们之间的主要区别是：

findIndex() 方法获取如下回调函数：

var x = [1,2,3];
x.findIndex(x=> x==3); //returns 2

但indexOf函数只得到这样的值：

x.indexOf(3); // returns 2;

如果你尝试将回调传递给indexOf，它会返回-1；

x.indexOf(x => x==3); //returns -1

如果尝试将值传递给 findIndex 它会返回错误：

x.findIndex(3); //Uncaught TypeError: 3 is not a function at Array.findIndex (<anonymous>) at <anonymous>:1:3

Answer 3

如果要查找与谓词匹配的第一个元素,FindIndex非常有用:在W3C的示例中,如果客户的年龄高于或等于18,则会有数字和匹配.

var ages = [3, 10, 18, 20];

function checkAdult(age) {
    return age >= 18;
}

console.log(ages.findIndex(checkAdult));

安慰:

2

您可以使用Array的indexOf函数找到精确的元素索引,但不能传递谓词.如果要查找特定元素,速度会更快:

var ages = [3, 10, 18, 20];
console.log(ages.indexOf(10));

收益:

1

索引计数从0开始,因此第一个元素索引为0.

Answer 4

您还可以使用includes：

[1, 2, 3].includes(2);      // true
[1, 2, 3].includes(4);      // false
[1, 2, 3].includes(3, 3);   // false

但我更喜欢这种indexOf方法：

var vals = [ "foo", "bar", 42, "baz" ];
if (~vals.indexOf( 42 )) {
  // found it!
}

Answer 5

主要区别在于这些函数的参数：

-> Array.prototype.indexOf() :

   var fruits = ["Banana", "Orange", "Apple", "Mango"];
   var a = fruits.indexOf("Apple");
   The result of a will be: 2

-> Array.prototype.findIndex()：

       var ages = [3, 10, 18, 20];

       function checkAdult(age) {
        return age >= 18;
       }

       function myFunction() {
         document.getElementById("demo").innerHTML = 
         ages.findIndex(checkAdult);
       }

       The result will be: 2

Answer 6

另一个区别是使用findIndex()用户可以应用一些函数并在数组中找到通过测试的元素。

但indexOf()运算符并非如此。用户可以只检查特定元素是否存在于数组中。

Answer 7

简单 - 您使用的是哪种数组结构？

• 如果对象数组，findIndex();
• 否则，indexOf()。

“我想在对象数组中找到索引，键为“Orange”。

let fruits = [
   { type: "Apple", quantity: 9 },
   { type: "Banana", quantity: 2},
   { type: "Orange", quantity: 8},
   { type: "Pear", quantity: 777}
];

let myIndex = fruits.findIndex(fruit => fruit.type === "Orange"); // Returns 2.

“我想在一个简单的数组中找到索引”。

let fruits = [ "Apple", "Banana", "Pear", "Orange"];

let index = fruits.indexOf("Orange"); // Returns 3.