Иногда нам может потребоваться получить отдельные значения из массива объектов в нашем коде JavaScript.
В этой статье мы рассмотрим, как получить различные значения из массива объектов в JavaScript.
Извлечение значений с помощью методов массива
Один из способов получить отдельные значения из массива объектов в JavaScript - использовать собственные методы массива.
Например, мы можем написать:
const array = [{ "name": "jane", "age": 17 }, { "name": "joe", "age": 17 }, { "name": "bob", "age": 35 } ]; const uniques = array.map(item => item.age) .filter((value, index, self) => self.indexOf(value) === index) console.log(uniques)
для вызова map
и filter
для возврата уникальных значений свойства age
из всех элементов в массиве.
Мы вызываем map
, чтобы вернуть массив со всеми значениями age
.
Затем мы используем filter
, чтобы вернуть массив с различными значениями массива значений age
, возвращенного из map
.
Обратный вызов, который мы передаем в filter
, имеет параметры value
, index
и self
.
value
имеет значение, которое проходит итерацию.
index
имеет индекс value
.
А self
- это сам array
.
Мы можем проверить, является ли это первым экземпляром заданного значения с помощью self.indexOf(value) === index
.
indexOf
возвращает индекс первого экземпляра value
в массиве.
Таким образом, мы можем использовать этот возвращаемый массив, который имеет только первый экземпляр данного элемента.
Следовательно, uniques
это [17, 35]
.
Мы можем заменить вызов filter
, поместив массив значений age
в набор, а затем распространив его обратно в массив:
const array = [{ "name": "jane", "age": 17 }, { "name": "joe", "age": 17 }, { "name": "bob", "age": 35 } ]; const uniques = [...new Set(array.map(item => item.age))] console.log(uniques)
И uniques
имеет то же значение, что и в предыдущем примере.
Распространение можно заменить методом Array.from
:
const array = [{ "name": "jane", "age": 17 }, { "name": "joe", "age": 17 }, { "name": "bob", "age": 35 } ]; const uniques = Array.from(new Set(array.map(item => item.age))) console.log(uniques)
поскольку Array.from
работает с любыми итерируемыми объектами, включая наборы, для преобразования их в массив.
Лодаш
Lodash имеет метод uniq
для возврата уникальных значений из массива объектов.
Итак, мы можем использовать это в письменной форме;
const array = [{ "name": "jane", "age": 17 }, { "name": "joe", "age": 17 }, { "name": "bob", "age": 35 } ]; const uniques = _.uniq(_.map(array, 'age')); console.log(uniques)
Мы вызываем map
, чтобы вернуть массив age
значений из array
.
Затем мы вызываем uniq
в возвращенном массиве, чтобы получить уникальные значения из этого возвращенного массива.
Таким образом, мы получаем тот же результат для uniques
, что и в других примерах.
Заключение
Мы можем использовать собственные методы массива JavaScript или Lodash для извлечения различных значений из свойства из массива объектов.
Больше контента на plainenglish.io