>웹 프론트엔드 >JS 튜토리얼 >JavaScript의 `forEach()` 메소드와 `map()` 메소드의 주요 차이점은 무엇입니까?

JavaScript의 `forEach()` 메소드와 `map()` 메소드의 주요 차이점은 무엇입니까?

Mary-Kate Olsen
Mary-Kate Olsen원래의
2024-12-20 05:38:13429검색

What's the Key Difference Between JavaScript's `forEach()` and `map()` Methods?

JavaScript에서 .forEach()와 .map()의 차이점 이해

.forEach()가 작동하는 기본 차이점을 넘어서 .map()이 새 배열을 생성하는 동안 원래 배열을 사용하는 경우 고려해야 할 미묘한 차이가 있습니다. 이는 제공된 코드에 예시되어 있습니다:

function practice(i) {
  return i + 1;
}

var a = [-1, 0, 1, 2, 3, 4, 5];
var b = [0];
var c = [0];
console.log(a);
b = a.forEach(practice);
console.log("=====");
console.log(a);
console.log(b);
c = a.map(practice);
console.log("=====");
console.log(a);
console.log(c);

출력:

[-1, 0, 1, 2, 3, 4, 5]
=====
[-1, 0, 1, 2, 3, 4, 5]
undefined
=====
[-1, 0, 1, 2, 3, 4, 5]
[0, 1, 2, 3, 4, 5, 6]

설명:

  • forEach(): 이 방법은 배열의 각 요소를 반복하지만 값을 반환하지는 않습니다. 예제에서 a.forEach(practice)는 'a'의 각 요소에 대해 연습 함수를 실행하지만 결과(정의되지 않음)는 'b'에 할당되지 않습니다. 따라서 'b'는 변경되지 않습니다.
  • map(): 이 메서드는 원본 배열의 각 요소를 변환하여 새 배열을 생성합니다. 예제에서 a.map(practice)는 'a'의 각 요소에 연습 함수를 적용하고 변환된 값이 포함된 새 배열 'c'를 반환합니다.

주요 차이점:

  • 반환 값: forEach()는 아무것도 반환하지 않지만, map()은 새 배열을 생성합니다.
  • 작업: forEach()는 반복하고 부작용을 수행하는 반면 map()은 반복하고 변환합니다.
  • 부작용 : forEach()는 콜백 함수를 통해 원래 배열을 변경할 수 있지만 map()은 배열만 변환합니다.

JavaScript에서 배열 조작에 적합한 방법을 선택할 때 이러한 차이점을 이해하는 것이 중요합니다.

위 내용은 JavaScript의 `forEach()` 메소드와 `map()` 메소드의 주요 차이점은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.