对象数组中的indexOf方法?

JavaScript

Sam蛋蛋Itachi

2020-03-12

获取包含对象的数组的索引的最佳方法是什么?

想象一下这种情况:

var hello = {
    hello: 'world',
    foo: 'bar'
};
var qaz = {
    hello: 'stevie',
    foo: 'baz'
}

var myArray = [];
myArray.push(hello,qaz);

现在,我想拥有indexOf对象对象,该对象的hello属性'stevie'在此示例中为1

我是JavaScript的新手,我不知道是否有一个简单的方法,或者是否应该构建自己的函数来做到这一点。

第1247篇《对象数组中的indexOf方法?》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

9个回答
GO西门LEY 2020.03.12

You can create your own prototype to do this:

something like:

Array.prototype.indexOfObject = function (object) {
    for (var i = 0; i < this.length; i++) {
        if (JSON.stringify(this[i]) === JSON.stringify(object))
            return i;
    }
}
前端L 2020.03.12
var hello = {hello: "world",  foo: "bar"};
var qaz = {hello: "stevie", foo: "baz"};
var myArray = [];
myArray.push(hello,qaz);

function indexOfObject( arr, key, value   ) {
    var j = -1;
    var result = arr.some(function(obj, i) { 
        j++;
        return obj[key] == value;
    })

    if (!result) {
        return -1;
    } else {
        return j;
    };
}

alert(indexOfObject(myArray,"hello","world"));
L西门 2020.03.12

This works without custom code

var arr, a, found;
arr = [{x: 1, y: 2}];
a = {x: 1, y: 2};
found = JSON.stringify(arr).indexOf(JSON.stringify(a)) > - 1;
// found === true

Note: this does not give the actual index, it only tells if your object exists in the current data structure

樱猪猪 2020.03.12

simple:

myArray.indexOf(myArray.filter(function(item) {
    return item.hello == "stevie"
})[0])
小宇宙猪猪 2020.03.12

Try this:

console.log(Object.keys({foo:"_0_", bar:"_1_"}).indexOf("bar"));

https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/keys

A飞云 2020.03.12

或原型:

Array.prototype.indexOfObject = function arrayObjectIndexOf(property, value) {
    for (var i = 0, len = this.length; i < len; i++) {
        if (this[i][property] === value) return i;
    }
    return -1;
}

myArr.indexOfObject("name", "stevie");
A蛋蛋乐 2020.03.12

我喜欢Pablo的回答,但是Array#indexOf和Array#map并非在所有浏览器上都起作用。下划线将使用本机代码(如果可用),但也具有后备功能。此外,它具有可完全执行Pablo匿名地图方法所用的pluck方法。

var idx = _.chain(myArray).pluck("hello").indexOf("Stevie").value();
老丝猿阿飞 2020.03.12
var idx = myArray.reduce( function( cur, val, index ){

    if( val.hello === "stevie" && cur === -1 ) {
        return index;
    }
    return cur;

}, -1 );
小小飞云 2020.03.12

除IE(非边缘)以外的所有浏览器均支持Array.prototype.findIndex但是提供polyfill很好。

var indexOfStevie = myArray.findIndex(i => i.hello === "stevie");

地图的解决方案是可以的。但是您每次搜索都会遍历整个数组。对于findIndex来说这只是最坏的情况,一旦找到匹配,它将停止迭代。


没有真正简洁的方法 (当开发人员不得不担心IE8时),但这是一个常见的解决方案:

var searchTerm = "stevie",
    index = -1;
for(var i = 0, len = myArray.length; i < len; i++) {
    if (myArray[i].hello === searchTerm) {
        index = i;
        break;
    }
}

或作为功能:

function arrayObjectIndexOf(myArray, searchTerm, property) {
    for(var i = 0, len = myArray.length; i < len; i++) {
        if (myArray[i][property] === searchTerm) return i;
    }
    return -1;
}
arrayObjectIndexOf(arr, "stevie", "hello"); // 1

只是一些注意事项:

  1. 不要在数组循环中使用...
  2. 找到“针”后,请务必打破循环或退出该功能
  3. 注意对象相等

例如,

var a = {obj: 0};
var b = [a];
b.indexOf({obj: 0}); // -1 not found

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android