📌  相关文章
📜  获取数组中对象的索引 - Javascript (1)

📅  最后修改于: 2023-12-03 14:57:15.486000             🧑  作者: Mango

获取数组中对象的索引 - Javascript

在Javascript中,获取数组中对象的索引有很多种方法。

以下是其中的几种方法:

使用 indexOf()

indexOf() 方法可以获取指定元素在数组中的位置,如果元素不存在则返回 -1。

const arr = [{ id: 1, name: 'Alice' }, { id: 2, name: 'Bob' }, { id: 3, name: 'Charlie' }];

const index = arr.indexOf({ id: 2, name: 'Bob' });

console.log(index); // -1

可以看到,上述代码中虽然数组中存在 { id: 2, name: 'Bob' } 这个对象,但是由于 indexOf() 比较的是对象的引用,所以结果是 -1。

因此,如果要使用 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
使用 findIndex()

findIndex() 方法可以根据指定规则查找数组中满足条件的对象,并返回它的索引。如果没有满足条件的对象,则返回 -1。

const arr = [{ id: 1, name: 'Alice' }, { id: 2, name: 'Bob' }, { id: 3, name: 'Charlie' }];

const index = arr.findIndex(function(item) {
  return item.id === 2;
});

console.log(index); // 1

可以看到,上述代码使用 findIndex() 查找了 id 为 2 的对象,并返回它的索引。

使用 filter()

filter() 方法可以根据指定规则过滤出数组中满足条件的所有对象,并返回一个新的数组。

const arr = [{ id: 1, name: 'Alice' }, { id: 2, name: 'Bob' }, { id: 3, name: 'Charlie' }];

const results = arr.filter(function(item) {
  return item.id === 2;
});

console.log(results); // [{ id: 2, name: 'Bob' }]

可以看到,上述代码使用 filter() 过滤出了 id 为 2 的对象,并返回一个长度为 1 的新数组。

如果要获取这个对象在原数组中的索引,可以使用 indexOf() 方法。

const arr = [{ id: 1, name: 'Alice' }, { id: 2, name: 'Bob' }, { id: 3, name: 'Charlie' }];

const results = arr.filter(function(item) {
  return item.id === 2;
});

const index = arr.indexOf(results[0]);

console.log(index); // 1

可以看到,上述代码先使用 filter() 方法获取到 id 为 2 的对象,然后使用 indexOf() 方法获取它在原数组中的索引。

以上就是获取数组中对象的索引的几种方法。根据实际情况选择合适的方法即可。