JavaScript Map () Метод

Сегодня еще один отличный метод массива, следующий уменьшить () и Filter () , есть map () Анкет

Что особенно делает карту? Он возвращает множество конкретных значений, скажем, вам нужен только список цен из ваших продуктов?

Или комбинированное полное имя на основе двух полей?

Позвольте мне показать вам, как карта облегчает нашу жизнь для этого.

Использование метода JavaScript Map ()

Давайте начнем с создания множества предметов.

const items = [
  { name: 'T-shirt plain', price: 9 },
  { name: 'T-shirt print', price: 20 },
  { name: 'Jeans', price: 30 },
  { name: 'Cap', price: 5 }
];

Теперь мы просто хотим, чтобы цены действительно.

Мы могли бы зацикливаться на предметах и подтолкнуть цену до нового массива, верно?

let prices = [];
items.forEach(item => {
  prices.push(item.price);
});
// [ 9, 20, 30, 5 ]

Успех! Но нам нужно было определить пустой массив и вручную петлю, его можно просто облегчить.

const prices = items.map(item => {
  return item.price;
});
// [ 9, 20, 30, 5 ]

Ах, круто! То же самое, но лучше.

Как уже упоминалось, вы также можете использовать его, чтобы объединить вещи, скажем, у нас есть список пользователей.

const users = [
  { firstname: 'Louise', lastname: 'Belcher' },
  { firstname: 'Bob', lastname: 'Belcher' },
  { firstname: 'Tina', lastname: 'Belcher' },
  { firstname: 'Jimmy', lastname: 'Pesto' }
];

Теперь мы хотим получить полные имена:

const fullnames = users.map(item => {
  return `${item.firstname} ${item.lastname}`;
});
// [ 'Louise Belcher', 'Bob Belcher', 'Tina Belcher', 'Jimmy Pesto' ]

Я надеюсь, что вы узнали, что может принести метод Map (), и даст вам представление о том, как его использовать.

Спасибо за чтение, и давайте подключимся!

Спасибо за чтение моего блога. Не стесняйтесь подписаться на мою рассылку электронной почты и подключиться к Facebook или Твиттер

Оригинал: “https://dev.to/dailydevtips1/javascript-map-function-56fa”

Использование метода JavaScript Map ()

Спасибо за чтение, и давайте подключимся!

Читайте ещё по теме: