#1 Метод each в lodash

Всем привет. Сегодня мы с вами начинаем серию уроков о библиотеке lodash. Зачем она вообще нужна и что это такое? Она представляет собой набор полезных функций для работы с данными, для конвертирования их из одного формата в другой, фильтрации, маппинга и имеет много других фич.

Лично я ее использую на всех своих проектах. И большинство функций по работе с данными представляют для меня цепочки вызовов lodash функций. Сама библиотека, как вы можете видеть, на оффициальном сайте, достаточно небольшая. Она занимает в сжатом виде всего лишь 22 килобайта, но достаточно полезна.

Сегодня мы с вами познакомимся с очень популярным методом forEach или each, как его обычно используют и посмотрим чем он отличается он нативного метода javascript each.

Давайте посмотрим.

Нативно forEach обычно используют так

[1,2].forEach(function (item) {
  console.log(item);
});

допустим у нас есть массив из двух елементов и в forEach мы передаем функцию, в которой будет аргумент item. И выведем этот item.

Как мы видим, на экран вывелось 1 и 2. То есть мы в этой функции, которую мы передали в forEach получаем доступ к каждому елементу, тем самым проходя по циклу. Первым аргументом идет каждый елемент массива.

Давайте напишем тоже самое с помощью each lodash.

_.each([1, 2], function (item) {
  console.log(item);
});

Первым аргументом у нас идет массив, а вторым функция, внутри которой мы передаем этот же item. Если же мы выведем сдесь item, то мы увидим те же самые значения. Исключение составляет только то, что в нативном методе у нас вернулось undefined, а тут вернулся исходных массив. В чем же разница и зачем нам использовать lodash, если можно эту же функцию использовать нативно.

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

Например у нас есть обьект

var a = {id: 1, name: "some name"}

и мы хотим по нему пройти. Если мы попробуем

a.forEach

то мы увидим, что такой функции нет, поскольку у обьекта нет функции forEach.

В lodash же мы можем это сделать. Первым параметром передаем наш обьект, вторым параметром нашу функцию

_.each(a, function (item) {
  console.log(item);
})

то мы увидим, что у нас вывелись значения нашего обьекта. Так же мы видим, что в ответ нам вернулся наш обьект. Если мы добавим вторым аргументом index и выведем его, то мы увидим, что нам вывелись ключи вместе с значениями.

_.each(a, function (item, index) {
  console.log(item, index);
})

То есть внутри в этой функции мы можем получить не только значения полей, но и ключи.

Давайте напишем пример, который очень часто приходится использовать на реальных проектах.

Допустим, у нас есть пустой массив и мы хотим пройти по всем елементам нашего обьекта а и записать все значения этого обьекта в массив.

var arr = [];
_.each(a, function (item) {
  arr.push(item);
});

Если мы теперь посмотрим на arr, то мы видим, что это массив из двух елементов.

В следующем уроке мы разберем, что такое map и чем он отличается от нативного.