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

我对两个函数indexOf和在数组中查找索引之间的差异感到困惑。

文档上说

findIndex -返回数组中第一个元素的索引

.谓词为真，否则为-1

而且

indexOf -返回一个值在列表中第一次出现的索引 数组。< / p >

131651 次浏览
小开
最佳答案

主要的区别是这些函数的参数:

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

  • Array.prototype.findIndex()期望一个回调作为第一个参数。如果你需要非基本类型(例如对象)数组中的索引，或者你的查找条件比一个值更复杂，可以使用这个方法。

有关这两种情况的示例，请参见链接。

小开

如果您希望找到与谓词匹配的第一个元素，那么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。

小开

你也可以使用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!
}
小开

主要的区别是这些函数的参数:

< p > - - > 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
小开

另一个区别是 使用< em > findIndex () < / em >返回用户可以应用一些函数，并找到数组中通过测试的元素 但是< em > indexOf () < / em >操作符并非如此。 用户可以检查数组中是否存在特定的元素

小开

简单-你使用的是哪种数组结构?

  • 如果对象数组，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.
小开

你可以试试下面的代码:-

let city = ['Delhi', 'mumbai']
const a = city.findIndex((item) =>
item.toLowerCase()==='delhi')
console.log(a) // returns 0


let c = city.indexOf('mumbai') // returns 1
console.log(c)
小开

它们之间的主要区别是:

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

如果试图将value传递给findIndex，它将返回一个错误:

x.findIndex(3); //Uncaught TypeError: 3 is not a function at Array.findIndex (<anonymous>) at <anonymous>:1:3
小开
  • findIndex接受回调作为参数，最好用于对象数组。
const employees = [
{ id: 1, name: "John", dob: 1999 },
{ id: 2, name: "Doe", dob: 2005 },
{ id: 3, name: "Marry", dob: 2001 },
{ id: 4, name: "Larry", dob: 1990 },
]


const output = employees.findIndex((elem) => elem.name === "Doe") // 1
  • indexOf接受一个值作为参数。
let alphabets = ["a", "b", "c", "d", "e"]
alphabets.indexOf("c") // 2

提交答案