Как улучшить свои навыки программирования и навыки решения проблем, когда речь идет о базовой итерации с помощью .map().
По сути, я хочу рассказать вам, как вы можете избежать записи периода For Loop при попытке перебирать данные. Это техника, которую должен знать каждый программист от новичка до эксперта. Я не уверен, почему они не преподают это как основу JavaScript в учебных курсах по кодированию, но очень важно, чтобы все знали, как использовать .map()!
Допустим, нам нужно перебрать массив или набор данных:
Пример:
Вместо того, чтобы писать базовый цикл For для перебора каждого объекта следующим образом:
for(let i = 0; i < data.length; i++) { data[i]; // accessing each object in the array data[i].name // accessing each object and their name in the array }
В основном выше я создал цикл For, чтобы перебирать массив и получать доступ к каждому объекту. Я вызвал data[i].name для доступа к каждому имени массива и так далее.
Или даже если бы у нас был простой массив:
const ARRAY = [20, 11, 15, 22, 33];
И я хотел что-то сделать с каждым из этих чисел в массиве.
Что ж, давайте перестанем использовать цикл For и воспользуемся .map() для перебора этих массивов следующим образом:
data.map(item => { item.name // will give me each name from the data array console.log(`Hello, ${item.name}"); // "Hello, Kylo Ren" // "Hello, Luke Skywalker" // "Hello, Han Solo" }) ARRAY.map(item => { let addFive = item + 5; let multiplyByTen = item * 10; console.log(addFive, multiplyByTen); // 25 , 200 // 16, 110 // 20, 150 // 27, 220 // 38, 330 })
И бум! Базовая итерация без цикла For. Все, что я сделал, это вызвал метод .map() для переменной массива. В скобках .map() я передал элемент параметра, который вызывает функцию. Бывший:
ARRAY.map(item => { //do something to item })
поэтому каждый «элемент» будет представлять каждый индекс или элемент массива. внутри этой функции мы можем что-то сделать с элементом, как показано в примере выше!
Мы также можем передать другой параметр под названием «ключ», который даст значение каждого индекса текущего элемента в массиве:
ARRAY.map((item, key) => { // where item = each number in Array 20, 11, 15, 22, 33 // and key = the index of each item. 0, 1, 2, 3, 4 })
Теперь мы можем решать базовые задачи без использования цикла For!
Скажем, я хочу что-то сделать с элементами только по определенным индексам:
let sum = 0; ARRAY.map((item, key) => { if(key === 0 || key === 4){ sum = item + sum; } }) // sum = 20 + 0 + 33 = 53
Выше я подсчитываю сумму только для индексов 0 и 4.
Мы также можем перемещаться по 2d-массиву с помощью .map:
Пример:
const 2dArray = [ [1,2,3], [4,5,6], [7,8,9]]; //accessing [1,2,3] , [4,5,6], [7,8,9] 2dArray.map(item => { //Accessing each number in array item.map(item => { console.log(item) // 1,2,3,4,5,6,7,8,9 }) })
Вывод:
Это было кратко, но, надеюсь, ясно… .map() необходим для того, чтобы быть хорошим программистом и понимать, как выполнять итерацию и обход массивов переменных, которые являются данными. Вы также можете решать сложные проблемы, понимая эту концепцию. Загляните на CodeWars.com и попробуйте решить несколько задач с помощью .map(), которые существенно помогут вам развить навыки решения проблем в течение следующей недели или если вы это реализуете.
Спасибо за чтение!
Благословить!