Введение
Задумывались ли вы когда-нибудь о разнице между map
и forEach
при работе с массивами в JavaScript? Если ваш ответ «да», то давайте прогуляемся по этим методам! 🚶♂️
🗺 map
Метод: трансформируйте и собирайте
Думайте о методе map
как о машине преобразования массивов. Он принимает массив, обрабатывает каждый элемент и создает совершенно новый массив с обработанными элементами. Это все равно, что отправить каждый предмет через процесс трансформации и собрать преобразованные предметы в новую корзину. Давайте посмотрим пример 👇🏽
Например, представьте, что у вас есть массив чисел и вы хотите удвоить каждое число ( Вот как бы вы это сделали 👇🏽
const numbers = [1, 2, 3, 4, 5]; const doubledNumbers = numbers.map(number => number * 2); // Result: [2, 4, 6, 8, 10]
Здесь map
применяет операцию number * 2
к каждому числу в массиве и собирает удвоенные числа в новый массив с именем doubledNumbers
.
🗼 forEach
Метод: экскурсия
Метод forEach
похож на гида, который проведет вас по каждому элементу массива и покажет все вокруг. Он не меняет элементы и не создает новый массив. Это все равно, что прогуляться по саду и полюбоваться цветами, не срывая их.
Например, предположим, что у вас есть массив имен, и вы просто хотите зарегистрировать каждое имя. Вот как бы вы это сделали. 👇🏽
const names = ['Lawrence', 'Dan', 'Trecia']; names.forEach(name => console.log(name)); // Output: Alice, Bob, Charlie
С помощью forEach
вы проходите по массиву и регистрируете каждое имя, но не меняете сам массив.
Краткое содержание
map
преобразует элементы и создает новый массив с преобразованными элементами.forEach
проводит вас по элементам, позволяя выполнять действия, но не создает новый массив и не изменяет существующий.
Заключение
Это все ребята. Надеюсь, теперь вы понимаете, что и как работает карта и метод forEach. Вы также можете задать вопрос, если вам не понятен какой-либо из этих методов. Желаем вам замечательных выходных и увидимся на следующей неделе. 😀