在前端开发中，经常需要在数组中查找对象的位置。在 ECMAScript 2019 中，新增了 Array.prototype.indexOf 方法，可以方便地查找对象在数组中的位置。本文将详细介绍如何利用这个方法进行查找，并提供示例代码和指导意义。
indexOf 方法的基本用法
Array.prototype.indexOf 方法用于查找数组中指定元素的位置。它接受一个参数，即要查找的元素，返回该元素在数组中的位置。如果数组中不存在该元素，则返回 -1。
下面是 indexOf 方法的基本用法示例：
const arr = [1, 2, 3]; const index = arr.indexOf(2); console.log(index); // 1
在上面的示例中，我们定义了一个数组 arr，然后使用 indexOf 方法查找元素 2 的位置，并将结果赋值给变量 index。最后，我们将 index 输出到控制台中，得到的结果是 1，即元素 2 在数组中的位置。
查找对象在数组中的位置
除了基本类型的数据，indexOf 方法也可以用于查找对象在数组中的位置。下面是一个查找对象在数组中的位置的示例：
const arr = [
{ id: 1, name: 'Alice' },
{ id: 2, name: 'Bob' },
{ id: 3, name: 'Charlie' },
];
const obj = { id: 2, name: 'Bob' };
const index = arr.indexOf(obj);
console.log(index); // 1在上面的示例中，我们定义了一个包含三个对象的数组 arr，然后定义了一个要查找的对象 obj，它的 id 和 name 属性与数组中第二个对象相同。接着，我们使用 indexOf 方法查找 obj 在数组中的位置，并将结果赋值给变量 index。最后，我们将 index 输出到控制台中，得到的结果是 1，即 obj 在数组中的位置。
需要注意的是，indexOf 方法是根据对象的引用进行查找的。也就是说，如果要查找的对象与数组中的对象虽然属性相同，但是它们是不同的对象实例，那么 indexOf 方法将返回 -1。下面是一个示例：
const arr = [
{ id: 1, name: 'Alice' },
{ id: 2, name: 'Bob' },
{ id: 3, name: 'Charlie' },
];
const obj = { id: 2, name: 'Bob' };
const index = arr.indexOf({ id: 2, name: 'Bob' });
console.log(index); // -1在上面的示例中，我们定义了一个包含三个对象的数组 arr，然后定义了一个要查找的对象 obj，它的 id 和 name 属性与数组中第二个对象相同。但是，我们没有将 obj 添加到数组中，而是直接使用了一个新的对象作为参数调用 indexOf 方法。结果，indexOf 方法返回了 -1，表示在数组中没有找到要查找的对象。
深度查找对象在数组中的位置
在实际开发中，我们经常需要根据对象的某个属性来查找对象在数组中的位置。为了实现这个功能，我们可以使用 indexOf 方法的另一个版本，即 Array.prototype.findIndex 方法。这个方法接受一个回调函数作为参数，该函数用于判断数组中的每个元素是否满足指定条件。如果找到满足条件的元素，则返回该元素在数组中的位置。如果没有找到满足条件的元素，则返回 -1。
下面是一个根据对象的某个属性来查找对象在数组中的位置的示例：
const arr = [
{ id: 1, name: 'Alice' },
{ id: 2, name: 'Bob' },
{ id: 3, name: 'Charlie' },
];
const obj = { id: 2, name: 'Bob' };
const index = arr.findIndex(item => item.id === obj.id);
console.log(index); // 1在上面的示例中，我们使用了 findIndex 方法来查找数组中 id 属性等于 obj.id 属性的元素。具体来说，我们定义了一个回调函数，该函数接受一个参数 item，表示数组中的每个元素。在回调函数中，我们使用 item.id === obj.id 来判断该元素是否满足条件。最后，我们将结果赋值给变量 index，并将其输出到控制台中，得到的结果是 1，即满足条件的元素在数组中的位置。
指导意义
通过本文的介绍，我们可以发现，ECMAScript 2019 中的 Array.prototype.indexOf 方法非常方便，可以用于查找基本类型的数据和对象在数组中的位置。对于对象的查找，我们可以使用 indexOf 方法进行浅层查找，也可以使用 findIndex 方法进行深度查找。这些方法可以大大提高我们的开发效率，减少代码量。
同时，我们也需要注意这些方法的一些限制。例如，indexOf 方法是根据对象的引用进行查找的，而不是根据属性进行查找的。如果要根据属性进行查找，我们需要使用 findIndex 方法。另外，findIndex 方法只会返回第一个满足条件的元素的位置，如果数组中存在多个满足条件的元素，我们需要使用循环或其他方法来处理。
总之，掌握这些方法，可以让我们更加高效地进行前端开发。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67959aac504e4ea9bdbb898e
