Phenquestions
Массив метод карты используется для создания нового сопоставленного массива на основе возвращаемого значения функции обратного вызова для каждого элемента.
var mappedArray = массив.карта (callbackFunction, thisValue)В Перезвоните - это функция, которая будет вызываться каждый раз для одного элемента и возвращать значение, которое будет сохранено в новом массиве. Синтаксис функции обратного вызова:
функция (значение, [индекс [, массив]])значение является необходимым аргументом, который фактически является единственным элементом массива.
В индекс - необязательный аргумент, который будет использоваться в качестве индекса каждого элемента в функции обратного вызова.
В множество также является необязательным аргументом. Мы можем передать этот аргумент, если хотим использовать массив в функции обратного вызова.
thisValue это значение, которое мы хотим передать, которое будет использоваться как «это» в функции обратного вызова. В противном случае будет передано «undefined».
Javascript предоставляет цикл for… in и цикл foreach для перебора элементов и управления массивами. Но зачем нам нужен метод карты помимо этого?? Для этого есть две основные причины. Первый - разделение задач, а второй - простой синтаксис для выполнения таких задач. Итак, давайте попробуем несколько разных примеров, чтобы продемонстрировать назначение и правильное использование.
Примеры
Прежде всего, у нас будет простая демонстрация, в которой у нас есть простой массив чисел, на котором мы попытаемся выполнить любую простую арифметическую операцию над каждым отдельным элементом.
var arr = [4, 8, 16, 64, 49];Теперь, прежде чем применять метод карты к этому массиву. Сначала мы напишем функцию обратного вызова, которую мы можем вызвать в нашей функции карты, в которой, скажем, мы хотим умножить каждый элемент на 10 и получить новый массив.
function multiply (element)var newElement = element * 10;
return newElement;
Все настроено для применения метода карты к массиву и получения требуемых результатов.
var newArr = arr.карта (умножить);Теперь, если мы посмотрим на «newArr»,
приставка.журнал (newArr);Мы можем видеть последний сопоставленный массив в выходных данных в соответствии с нашим требованием.
Имейте в виду, что длина нового сопоставленного массива определенно будет равна исходному массиву.
Существует более короткий способ выполнить ту же задачу, используя стрелку или анонимную функцию в методе карты. Итак, мы можем написать функцию обратного вызова в методе карты, подобном этому
var newArr = arr.map ((element) =>возвратный элемент * 10
)
Или, если мы хотим стать профессионалом и сделать его более лаконичным. Мы можем сделать это
var newArr = arr.карта (e => e * 10)Хорошо! Итак, это была самая простая демонстрация метода карты и различных способов написания функции обратного вызова. Но эта функция более удобна, когда мы играем с массивом объектов. Вот где и происходит настоящая реализация.
Использование карты с массивом объектов
В этом примере мы предполагаем массив объектов, каждый из которых содержит информацию об игроке. Имя игрока и его ID.
var arr = [id: 12, name: "Джеймс",
id: 36, name: "Morgan",
id: 66, name: "Иордания"
];
Теперь предположим, что мы хотим извлечь идентификаторы из каждого объекта и получить новый массив идентификаторов.
Но, чтобы понять, чем метод map отличается и помогает лучше, чем цикл foreach. Мы попробуем оба из них (метод карты и цикл foreach), чтобы выполнить одну и ту же задачу и узнать разницу.
Итак, сначала мы попытаемся извлечь идентификаторы с помощью цикла foreach, а затем с помощью метода карты.
var extractIDs = [];обр.forEach ((элемент) =>
вернуть извлеченные идентификаторы.push (элемент.я бы);
)
Теперь, если мы посмотрим на извлеченные идентификаторы.
приставка.журнал (извлеченные идентификаторы);
Мы разделили их в массив. Но теперь давайте продемонстрируем тот же результат, используя метод карты.
возвратный элемент.я бы;
)
приставка.журнал (извлеченные идентификаторы);
Глядя на разницу в коде и на один и тот же результат, мы можем понять истинную разницу между двумя методами (foreach и map). Синтаксис и разделение проблем.
Аналогичным образом мы можем выполнять множество других операций. Если нам нужно поиграть и получить данные из массива объектов. Мы предполагаем массив объектов, в котором каждый объект содержит два свойства: имя и фамилию.
var arr = [firstName: "Джон", lastName: "Doe",
firstName: "Морган", lastName: "Freeman",
firstName: "Джордан", lastName: "Петерсон"
];
Теперь мы хотим иметь массив, содержащий полные имена. Итак, мы напишем такую функцию карты, чтобы выполнить нашу задачу
var fullName = arr.карта ((человек) =>вернувшийся человек.firstName + "+ человек.Фамилия
)
приставка.журнал (полноеНазвание);
Как видите, у нас есть отдельный массив с полными именами. Замечательно.
Итак, это некоторые из основных и различных способов использования функции карты для выполнения наших требований разработки и помощи в жизни каждого разработчика javascript.
Заключение
В этой статье мы узнали о наиболее часто используемом методе javascript map () для массивов, а также узнали о некоторых различных способах использования метода map. Эта статья объясняет концепцию метода карты настолько простым и глубоким способом, что любой начинающий программист может понять его и использовать для своих нужд. Итак, продолжайте учиться, работать и получать опыт работы с javascript с помощью linuxhint.com, чтобы лучше понять это. Большое спасибо!
