Изучите комбинирование или изменение методов массива в JavaScript
1. Что такое Ченнинг ??
По сути, это вызов методов один за другим в одном операторе. Каждый метод в цепочке возвращает объект, который затем используется с другим методом и так далее. Как вы знаете, большинство методов Array возвращают массив, методы можно объединить в цепочку и использовать последовательно, чтобы сделать ваш код более кратким.
- Рассмотрим следующие данные:
const годы = [1989, 2015, 2000, 1999, 2013, 1973, 2012]; - Используя методы filter и map в массиве лет, мы создаем массив отображаемых строк для каждого года в 21 веке (помните: 21 век начинается с 2001 года). Каждая строка дисплея должна быть годом, за которым следует A.D.
displayYears = years.filter (num = ›num› = 2001) .map (num = ›num +« A.D »);
console.log (displayYears);
- Метод фильтрации будет использовать только годы 21 века, а метод Map
добавит н.э. в конце года.
вывод:
[“A.D.2015”, “A.D.2013”, “A.D.2012”]
2. Объекты в массиве
Он позволяет хранить несколько значений в одной переменной. Он хранит набор данных, но часто удобнее рассматривать массив как набор переменных одного типа.
- Рассмотрим следующие данные:
c onst авторы = [
{firstName: «Беатрикс», lastName: «Potter»},
{firstName: «Ann», lastName: «Martin» ”},
{firstName:« Беверли », lastName:« Cleary »},
{firstName:« Roald », lastName:« Dahl »},
{firstName:« Lewis », lastName: «Кэрролл»}
]; - Используя метод map для массива авторов, мы создаем массив строк с полным именем, состоящий из первого имени, затем пробела и затем фамилии. Мы сохраним новый массив в переменной fullAuthorNames.
let fullAuthorNames;
fullAuthorNames = sources.map (auth = ›auth.firstName +« «+ auth.lastName);
Вывод:
[«Беатрикс Поттер», «Энн Мартин», «Беверли Клири», «Роальд Даль», «Льюис Кэрролл»]
3. Объединение filter () или map ()
- Рассмотрим следующие данные:
const todos = [
{
todo: 'Buy apples',
done: false
},
{
задача: «Помыть машину»,
done: true
},
{
todo: «Написать веб-приложение»,
done: false
},
{
todo: 'Читать MDN-страницу в массивах JavaScript',
done: true
},
{
todo: 'Call мама ',
готово: false
}
]; - Используя методы filter и map в массиве задач, мы создаем массив строк незавершенных задач.
- filter () удалит все завершенные задачи из массива.
- Метод map () вернет список задач всех массивов и сохранит его в массиве незавершенных задач.
пусть незавершенные задачи;
undefinishedTasks = todos.filter (num = ›num.done === false) .map (num =› num.todo);
Вывод:
[«Купите яблоки», «Напишите веб-приложение», «Позвоните маме»]
4. Объединение filter () и reduce ()
- Рассмотрим следующие данные:
const PurchaItems = [
{
name: 'apples',
dept: 'groceries',
price: 2.49
},
{
name: 'хлеб',
отдел: 'бакалея',
цена: 2,99
},
{
название: 'батарейки',
отдел: 'электроника',
цена: 5.80
},
{
название: 'яйца',
отдел : 'бакалея',
цена: 3,99
},
{
name: 'футболки',
отдел: 'одежда',
цена : 9.99
}
]; - Используя методы filter () и reduce () в массиве PurchaseItems, добавьте общую стоимость всех продуктов (товары с отделом бакалеи). Сохраните общую цену в переменной groceryTotal.
- Метод filter () удалит все элементы, не относящиеся к продуктовому отделу.
- Метод reduce () суммирует общую стоимость продукта, вернет и сохранит значение в переменной groceryTotal.
let groceryTotal;
groceryTotal = PurchaseItems.filter (n = ›n.dept === 'бакалея'). reduce ((sum, n) =› sum + n.price, 0);
console.log (groceryTotal );
Вывод:
Мы видели основные методы массива ченнинга в JavaScript. Цепочка - это шаблон для вызова / вызова методов в функциональной программирование.
Спасибо за чтение🙂.