Фильтрация массива с помощью map [дубликат]

156
23 декабря 2021, 00:40
На этот вопрос уже дан ответ здесь:
Как разобрать JSON данные методом исключения? (1 ответ)
Закрыт 2 года назад.

Кажется, я не до конца понимаю,как работает map. Я пытаюсь вернуть массив,который не содержит элемента с определенным id.

const items = [ 
        { name: "Do my homework", id: 1 }, 
        { name: "Play with cat", id: 2 }, 
        { name: "Draw mother", id: 3 }, 
        { name: "Meet boyfriend", id: 4 } 
      ]; 
 
      const onDeleted = id => { 
        const notDeleted = items.map(item => { 
          let result = []; 
          if (item.id !== id) { 
            result.push(item); 
          } 
          return result; 
        }); 
        console.log(notDeleted); 
      }; 
 
      onDeleted(2);

Answer 1

Для фильтрации элементов массива, есть соответствующий метод - filter:

const items = [ 
  { name: "Do my homework", id: 1 }, 
  { name: "Play with cat", id: 2 }, 
  { name: "Draw mother", id: 3 }, 
  { name: "Meet boyfriend", id: 4 } 
]; 
 
const excludeById = id => items.filter(o => o.id !== id);  
console.log(excludeById(2));

В результирующий массив попадут только те элементы, для которых функция обратного вызова вернула истинное значение. Часто она содержит единственное выражение с логическим оператором - как и в нашем случае: достаточно вернуть результат неравенства (оно будет возвращать true если id не равны - а при их равенстве, результатом выражения будет false, и тогда элемент массива не попадет в результат).

А метод map не подходит для фильтрации по той простой причине, что предназначен он для преобразования элементов, и "не умеет" их пропускать... Каждое значение возвращаемое его функцией обратного вызова, в результирующем массиве займет место того элемента, для которого функция была вызвана.

Если не возвращать значение в коллбэке map, то элемент в результате все равно останется - место исходного значения элемента займет неявно возвращаемое значение undefined:

const arr = [1, 2, 3, 4, 5];  
const newArr = arr.map(v => { 
  if (v % 2) return v;  
});  
console.log(newArr); 

Answer 2

map() создаёт новый массив с результатом вызова указанной функции для каждого элемента массива

Тоесть достаточно просто возвращать отфильтрованные элементы в callback функции.

const items = [ 
  { name: "Do my homework", id: 1 }, 
  { name: "Play with cat", id: 2 }, 
  { name: "Draw mother", id: 3 }, 
  { name: "Meet boyfriend", id: 4 } 
]; 
 
const onDeleted = id => { 
  const notDeleted = items.map(function(item) { 
    if (item.id !== id) { 
      return item; 
    } 
  }); 
   
  console.log(notDeleted); 
}; 
 
onDeleted(2);

READ ALSO
Модальные окна и динамические списки

Модальные окна и динамические списки

Надо сделать подобноеЯ подобное сделал, но это получается говнокод какой-то и обслуживать его тоже вредно

191
Разделить API config на версию dev и prod webpack

Разделить API config на версию dev и prod webpack

Подскажите пожалуйста, есть вот файл configjs в нем экспортируемая переменная с ссылкой на API, но есть API для dev версии, а есть отдельное API для prod версии,...

304
Какой метод использовать для получения cookies?

Какой метод использовать для получения cookies?

Я делаю свое собственное расширение Chrome на JS, поэтому, мне нaдo получать куки с нужного сайтаНо я не знаю, какой метод мне использовать

193
Как реализовать подсветку в <code> html js?

Как реализовать подсветку в <code> html js?

Как сделать такую подсветку как например у нас на stackoverflow?

157