Как использовать lodash, чтобы найти и вернуть объект из массива?


148

Мои объекты:

[
    {
        description: 'object1', id: 1
    },
    {
        description: 'object2', id: 2
    }
    {
        description: 'object3', id: 3
    }
    {
        description: 'object4', id: 4
    }
]

В моей функции ниже я передаю описание, чтобы найти соответствующий идентификатор:

function pluckSavedView(action, view) {
    console.log('action: ', action);
    console.log('pluckSavedView: ', view);  // view = 'object1'

    var savedViews = retrieveSavedViews();
    console.log('savedViews: ', savedViews);

    if (action === 'delete') {
        var delete_id = _.result(_.find(savedViews, function(description) {
            return description === view;
        }), 'id');

        console.log('delete_id: ', delete_id); // should be '1', but is undefined
    }
}

Я пытаюсь использовать метод поиска lodash: https://lodash.com/docs#find

Однако моя переменная delete_idвыходит неопределенной.


Обновление для людей, проверяющих этот вопрос, Ramda - хорошая библиотека, которая делает то же самое, что делает lodash, но более функциональным способом программирования :) http://ramdajs.com/0.21.0/docs/


1
Мне непонятно, почему вы думаете, _.findчто волшебным образом передаст только одно из свойств обратному вызову. Простой console.log(description)ответный звонок мог бы сказать вам это.
Феликс Клинг

Ответы:


176

Аргумент, переданный обратному вызову, является одним из элементов массива. Элементы вашего массива являются объектами формы {description: ..., id: ...}.

var delete_id = _.result(_.find(savedViews, function(obj) {
    return obj.description === view;
}), 'id');

Еще одна альтернатива из документов, с которыми вы связаны (lodash v3):

_.find(savedViews, 'description', view);

Lodash v4:

_.find(savedViews, ['description', view]);

4
Спасибо! Я только что узнал, что это тоже работает. var delete_id = _.result(_.find(savedViews, { 'description': view }), 'id');Еще 10 минут ...
Леон Габан

Второе решение неверно, предикат должен быть массивом, чтобы использовать стенографию matchProperty: так должно быть_.find(savedViews, ['description', view])
frankss

1
@FranciscoGuimaraes: Хорошо, еще в 2015 году вот как работал lodash
Феликс Клинг

1
@FelixKling Я подозревал, что это может быть что-то вроде этого, но подумал, что лучше добавить комментарий для людей (таких как я), которые ищут ответ в 2018 году. Спасибо за обновление в ответе
frankss


29

Вы можете сделать это легко в vanilla JS:

С помощью find

const savedViews = [{"description":"object1","id":1},{"description":"object2","id":2},{"description":"object3","id":3},{"description":"object4","id":4}];

const view = 'object2';

const delete_id = savedViews.find(obj => {
  return obj.description === view;
}).id;

console.log(delete_id);

Использование filter(оригинальный ответ)

const savedViews = [{"description":"object1","id":1},{"description":"object2","id":2},{"description":"object3","id":3},{"description":"object4","id":4}];

const view = 'object2';

const delete_id = savedViews.filter(function (el) {
  return el.description === view;
})[0].id;

console.log(delete_id);


6
Правда, но lodash кажется намного чище, мне не нужно использовать [0]это решение, с которым я собираюсь. var delete_id = _.result(_.find(savedViews, { 'description': view }), 'id');Спасибо за демонстрацию +1
Леон Габан,

Разве это не даст сбой, когда вы вытолкнете [0] пустой результат? Так что +1 к @LeonGaban, что Lodash должен обработать это по умолчанию.
kiradotee

3
@LeonGaban все еще вы можете использовать очиститель без lodash без [0], используя ES6 savedViews.find(el => el.description === view)
Ram Babu S

Отличный ответ !!
Оле

11

С помощью findметода вашему обратному вызову будет передано значение каждого элемента, например:

{
    description: 'object1', id: 1
}

Таким образом, вы хотите код как:

_.find(savedViews, function(o) {
        return o.description === view;
})

8

для этого найдите данный объект в массиве, базовый пример использования _.find

const array = 
[
{
    description: 'object1', id: 1
},
{
    description: 'object2', id: 2
},
{
    description: 'object3', id: 3
},
{
    description: 'object4', id: 4
}
];

это будет хорошо работать

q = _.find(array, {id:'4'}); // delete id

console.log(q); // {description: 'object4', id: 4}

_.find поможет вернуть элемент в массив, а не его индекс. Так что, если у вас есть массив объектов, и вы хотите найти отдельный объект в массиве по определенному значению ключа, pare _.find - подходящий инструмент для этой работы.


7

Вам не нужны Лодаш, Рамда или любая другая дополнительная зависимость.

Просто используйте функцию ES6 find () функционально:

savedViews.find(el => el.description === view)

Иногда вам нужно использовать сторонние библиотеки, чтобы получить все вкусности, которые идут с ними. Однако, вообще говоря, старайтесь избегать зависимостей, когда они вам не нужны . Зависимости могут:

  • раздувать ваш размер кода в комплекте,
  • Вы должны будете держать их в курсе,
  • и они могут представлять ошибки или угрозы безопасности

Отличный ответ !! Именно то, что я искал.
Оле


6

Вы можете использовать следующее

import { find } from 'lodash'

Затем вернуть весь объект (не только его ключ или значение) из списка со следующим:

let match = find(savedViews, { 'ID': 'id to match'});

4

Импортировать lodashиспользуя

$ npm

var _ = require('lodash'); 

var objArrayList = 
    [
         { name: "user1"},
         { name: "user2"}, 
         { name: "user2"}
    ];

var Obj = _.find(objArrayList, { name: "user2" });

// Obj ==> { name: "user2"}

добавить подробности
Камень короля

1

Получить идентификатор на основе имени

 {
    "roles": [
     {
      "id": 1,
      "name": "admin",
     },
     {
      "id": 3,
      "name": "manager",
     }
    ]
    }



    fetchIdBasingOnRole() {
          const self = this;
          if (this.employee.roles) {
            var roleid = _.result(
              _.find(this.getRoles, function(obj) {
                return obj.name === self.employee.roles;
              }),
              "id"
            );
          }
          return roleid;
        },
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.