.map, .every 및 .forEach의 차이점은 무엇입니까?


118

나는 항상 그들 사이의 차이점이 무엇인지 궁금했습니다. 그들은 모두 같은 일을하는 것 같습니다 ...


6
누군가 jQuery 태그를 추가했습니다. jQuery 메소드를 고려 every하고 forEach있지는 않지만 어떤 식 으로든 jQuery와 관련된 질문은 없을 것 같습니다. developer.mozilla.org/en/JavaScript/New_in_JavaScript/1.6
— James Allardice 2011 년

나는이 링크 가 당신이 찾고있는 답을 가져야 한다고 생각합니다 .
— zBomb 2011 년

이전 의견의 링크에 자세히 설명 된대로 새로운 Mozilla 특정 배열 방법을 언급하고 있다고 생각하는 것이 맞습니까?
— James Allardice 2011 년

@James- Mozilla에만 국한되지 않습니다 . 나는 웹킷과 오페라 문서에 대한 링크도 공유하고 싶지만 그것들이 내 머리 꼭대기에서 어디인지 모르겠다.
— gilly3 2011 년

@ gilly3-아, 좋은 지적입니다. 나는 그들이 IE9에서만 지원한다고 믿습니다.
— James Allardice 2011 년

답변:


224

차이점은 반환 값에 있습니다.

.map() 원래 항목에 대해 몇 가지 작업을 수행하여 생성 된 새 객체 배열을 반환합니다 .

.every() 부울을 반환합니다. 이 배열의 모든 요소가 제공된 테스트 함수를 충족하는 경우 true입니다. 의 중요한 차이점 .every()은 배열의 모든 요소에 대해 테스트 함수가 항상 호출되는 것은 아니라는 것입니다. 테스트 함수가 요소에 대해 false를 반환하면 더 이상 배열 요소가 반복되지 않습니다. 따라서 테스트 기능은 일반적으로 부작용 이 없어야 합니다 .

.forEach() 아무것도 반환하지 않음 -배열의 각 항목에 대해 주어진 작업을 수행하는 배열을 반복합니다.

MDN에서 이것들과 다른 많은 어레이 반복 방법에 대해 읽어보십시오 .


또는 MDN 이 인용 될 수 있습니다
— JoshWillik 2014 년

3
@josh-MDN을 인용했습니다. 각 메소드 이름은 MDN의 해당 문서에 링크됩니다.
— gilly3 2014 년

@ gilly3, 사과드립니다. 파란색 텍스트>.>
— JoshWillik

.forEach ()는 지금은 아무 잘못도 반환하지 않습니다. 2012 년에는 아닐 수도 있지만 적어도 2015 년에는 Chrome에서 다음을 시도하십시오. arr2 = [ 'sue', 'joe', 'ben', 'guy', 'tom', 'jon ']; b = arr2.forEach (function (el, indx) {console.log (indx + ':'+ el);}); console.log (b);
— jason

1
@EugeneMercer "원래 항목"이란 배열의 각 요소의 원래 값을 의미합니다.
— gilly3

88

gilly3의 대답은 훌륭합니다. 다른 유형의 "요소를 통한 루프"기능에 대한 약간의 정보를 추가하고 싶었습니다.

  • .every() (반복자가 처음으로 거짓을 반환하거나 거짓을 반환 할 때 루프를 중지합니다.)
  • .some() (반복자가 참 또는 진실을 처음으로 반환 할 때 루프를 중지합니다)
  • .filter() (필터 함수가 true를 반환하고 false를 반환하는 요소를 생략하는 요소를 포함하는 새 배열을 만듭니다)
  • .map() (반복자 함수가 반환 한 값에서 새 배열을 만듭니다)
  • .reduce() (반복기를 반복하여 호출하고 이전 값을 전달하여 값을 빌드합니다. 자세한 내용은 사양을 참조하세요. 배열의 내용을 합산하는 데 유용합니다.)
  • .reduceRight() (감소와 같지만 오름차순이 아닌 내림차순으로 작동)

신용 : TJCrowder For-each over an array in JavaScript?


좋아요 100 개 받기!
— Shamim

6

위의 훌륭한 답변에 대한 또 다른 고려 사항은 연결입니다. forEach ()를 사용하면 연결할 수 없지만 map ()을 사용하면 할 수 있습니다.

예를 들면 :

var arrayNumbers = [3,1,2,4,5];

arrayNumbers.map(function(i) {
    return i * 2
}).sort();

.forEach ()를 사용하면 .sort ()를 수행 할 수 없으며 오류가 발생합니다.


0

들어 Ramda 의 차이 R.map()와는 R.forEach()것입니다 :

  1. R.forEach()원래 배열을 R.map()반환하고 펑터를 반환합니다.
  2. R.forEach()배열에서만 작동 할 수 있지만 R.map()객체에서도 작동 할 수 있습니다 (즉, 객체의 키 / 값 쌍이 배열처럼 취급 됨).

문제는 자바 스크립트 언어와 관련이 있습니다. Ramda는 위대하지만 완전히 다른 주제와 라이브러리입니다.
— SeaWarrior404
당사 사이트를 사용함과 동시에 당사의 쿠키 정책과 개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.