使用 Javascript/React.js 查找对象的数组索引

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/35823783/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 18:15:46  来源:igfitidea点击:

Finding the array index of an object with Javascript/React.js

javascriptreactjs

提问by user1072337

I have an array that looks like so:

我有一个看起来像这样的数组:

var skillsets = [
  {id: 'one', name: 'george'},
  {id: 'two', name: 'greg'},
  {id: 'three', name: 'jason'},
  {id: 'four', name: 'jane'},
];

what I would like to do is find the row based on a value given in the form of an id with Javascript. For instance, if I put "id='two'" into the function, I'd like "1" to be returned as the row.

我想要做的是根据以 id 形式给出的值使用 Javascript 查找行。例如,如果我将“id='two'”放入函数中,我希望将“1”作为行返回。

I know for a single row array, skillsets.indexOf['value'] would work, but that won't work for this JSON set.

我知道对于单行数组,skillsets.indexOf['value'] 会起作用,但这不适用于这个 JSON 集。

How can I achieve this?

我怎样才能做到这一点?

EDIT:

编辑:

Skills = React.createClass({

    getInitialState: function() {
      return { id: 'default' };
    },

    getIndex(value, arr, prop) {
    for(var i = 0; i < arr.length; i++) {
        if(arr[i][prop] === value) {
            return i;
        }
    }
    return -1; //to handle the case where the value doesn't exist
    },

    render: function() {

        var index = getIndex(id, skillsets, 'id');

        return (

            <section id="three" className="main style1 special">
                <div className="container">

                    <SkillsHeader skillsets={skillsets[index]}/>
                    {index}
                    <SkillsDetails details={details}/>
                    {index}

                </div>
            </section>

        );

    }
});

回答by Tarun Dugar

A simple forloop wrapped in a reusable function is good enough:

一个for包含在可重用函数中的简单循环就足够了:

function getIndex(value, arr, prop) {
    for(var i = 0; i < arr.length; i++) {
        if(arr[i][prop] === value) {
            return i;
        }
    }
    return -1; //to handle the case where the value doesn't exist
}

Here, valueis the value you want to match against, arris the array of objects, and propis the property of each iterable of the array which should match the value.

在这里,value是要匹配的值,arr是对象数组,是数组prop中每个应匹配value.

You can use this function for any json with the structure you mentioned. In your specific case, call it like this:

您可以将此函数用于具有您提到的结构的任何 json。在您的具体情况下,这样称呼它:

var index = getIndex('one', skillsets, 'id');

回答by djechlin

Lodash has a findIndexmethod that does exactly this.

Lodash 有一个findIndex方法可以做到这一点。

var users = [
  { 'user': 'barney',  'active': false },
  { 'user': 'fred',    'active': false },
  { 'user': 'pebbles', 'active': true }
];

_.findIndex(users, function(o) { return o.user == 'barney'; });
// → 0

// The `_.matches` iteratee shorthand.
_.findIndex(users, { 'user': 'fred', 'active': false });
// → 1

// The `_.matchesProperty` iteratee shorthand.
_.findIndex(users, ['active', false]);
// → 0

// The `_.property` iteratee shorthand.
_.findIndex(users, 'active');
// → 2

But I think ES6 just supports the lambda version anyway (?) it's in the doc on the flux page:

但我认为 ES6 无论如何都支持 lambda 版本(?)它在通量页面的文档中:

 removeTodo (id) {
        let index = this.todos.findIndex(todo => todo.get('id') === id);

        // remove the todo with the ID of id, but only if we have it to begin with
        this.todos = index > -1 ?
            this.todos.remove(index) :
            this.todos;
    },