JavaScript 맵과 forEach에서 어느 것이 더 빠릅니까?

May 04 2023

map() 및 forEach()는 모두 배열의 각 항목을 반복하는 데 사용되는 JavaScript의 배열 메서드입니다. 그러나 기능이 다르므로 특정 시나리오에서 다르게 수행됩니다.

둘 map()다 forEach()배열의 각 항목을 반복하는 데 사용되는 JavaScript의 배열 메서드입니다. 그러나 기능이 다르므로 특정 시나리오에서 다르게 수행됩니다. map()이 기사에서는 및 사이의 차이점 forEach()과 성능에 미치는 영향에 대해 살펴보겠습니다 .

방법 `map()`_

이 map()방법은 기존 배열의 각 요소에 대해 함수를 수행하여 새 배열을 만드는 데 사용됩니다. 원래 배열과 동일한 수의 요소가 있는 새 배열을 반환합니다. 여기서 각 요소는 원래 배열의 해당 요소에 적용된 함수의 결과입니다.

map()다음은 배열의 각 숫자를 두 배로 사용하는 예입니다 .

const originalArray = [1, 2, 3, 4, 5];
const doubledArray = originalArray.map((num) => num * 2);
console.log(doubledArray); // Output: [2, 4, 6, 8, 10]

방법 `forEach()`_

이 forEach()메서드는 배열의 각 요소에 대해 함수를 실행하는 데 사용됩니다. 기존 배열처럼 새 배열을 만들지 않고 map()대신 기존 배열의 각 요소에 대해 작업을 수행합니다.

forEach()다음은 배열의 각 항목을 기록하는 데 사용하는 예입니다 .

const originalArray = ['apple', 'banana', 'orange'];
originalArray.forEach((item) => console.log(item));
// Output: "apple", "banana", "orange"

성능 차이

map()둘 다 비슷한 작업을 수행 하지만 forEach()성능에는 몇 가지 주요 차이점이 있습니다.

한 가지 중요한 차이점은 map()새로운 배열을 반환하지만 forEach()그렇지 않다는 것입니다. 즉, 기존 배열의 값을 기반으로 새 배열을 만들어야 하는 경우 가 map()더 나은 선택임을 의미합니다. 반면에 배열의 각 요소에 대해 작업을 수행하기만 하면 되고 새 배열을 만들 필요가 없는 경우에는 forEach()더 나은 선택일 수 있습니다.

map()또 다른 차이점은 원래 배열과 길이가 같은 새 배열을 생성하지만 forEach()원래 배열의 길이는 수정하지 않는다는 것 입니다 . 즉, map()추가 메모리 할당 및 복사가 필요하므로 결과 배열이 필요하지 않은 경우 속도가 느려질 수 있습니다.

속도 면에서 새 어레이를 생성할 필요가 없기 때문에 단순 반복 forEach()보다 빠른 것이 일반적으로 받아들여집니다. 그러나 이는 특정 사용 사례와 처리 중인 데이터의 양에 따라 달라질 수 있습니다.map()forEach()

예

숫자 배열이 있고 각 요소에 함수를 적용하고 결과와 함께 새 배열을 반환하려는 예를 생각해 봅시다. map()이를 달성하기 위해 및 forEach()각 방법의 성능을 측정할 것입니다 .

const numbers = [1, 2, 3, 4, 5];

// Using map()
console.time('map');
const doubledNumbersMap = numbers.map((num) => num * 2);
console.timeEnd('map');

// Using forEach()
console.time('forEach');
const doubledNumbersForEach = [];
numbers.forEach((num)
{
doubledNumbersForEach.push(num * 2);
});
console.timeEnd('forEach');

console.log(doubledNumbersMap); // Output: [2, 4, 6, 8, 10]
console.log(doubledNumbersForEach); // Output: [2, 4, 6, 8,

이 코드를 실행하면 다음과 같은 결과가 나타납니다.

map: 0.012939453125ms
forEach: 0.007080078125ms

*결론**

결론적으로 `map()`과 `forEach()`는 모두 유사한 작업을 수행하지만 기능이 다른 JavaScript의 유용한 배열 메서드입니다. `map()`은 기존 배열의 값을 기반으로 새 배열을 생성하는 반면 `forEach()`는 새 배열을 생성하지 않고 배열의 각 요소에 대해 작업을 수행합니다.

성능 측면에서 `forEach()`는 새 배열을 생성하지 않기 때문에 일반적으로 `map()`보다 단순 반복에 더 빠릅니다. 그러나 이는 특정 사용 사례와 처리 중인 데이터의 양에 따라 달라질 수 있습니다. 따라서 `map()`과 `forEach()` 중에서 선택할 때 코드의 특정 요구 사항을 고려하는 것이 중요합니다.

읽어 주셔서 감사합니다!

이 기사가 도움이 되었기를 바랍니다. 질문이나 제안 사항이 있으면 의견을 남겨주세요. 귀하의 피드백은 제가 더 나아지는 데 도움이 됩니다.