JS_javascript 기술의 Each, $.each 및 map 메소드에 권장됩니다.

forEach는 ECMA5의 새로운 Array 메서드 중 가장 기본적인 메서드로 순회 및 루프입니다. 예를 들면 다음과 같습니다.

[1, 2,3, 4].forEach(경고);

다음 for 루프와 동일

var array = [1, 2, 3, 4];
for (var k = 0, length = array.length; k < length; k++) {
 alert(array[k]);
}

배열 ES5의 새로운 메소드에서는 매개변수가 모두 함수 유형이며 forEach 메소드의 함수 콜백은 3개의 매개변수를 지원합니다. 해당 배열 인덱스, 세 번째는 배열 자체입니다.

따라서 다음이 있습니다.

[].forEach(function(value, index, array) {
  // ...
});

jQuery의 $.each 메소드 비교:

$.each([], function(index, value, array) {
  // ...
});

첫 번째와 두 번째 매개변수가 정확히 반대라는 것을 알 수 있으니 주의하시고 잘못 기억하지 마세요. $.map과 같은 유사한 메소드에 대해서도 마찬가지입니다.

var data=[1,3,4] ; 
var sum=0 ;
data.forEach(function(val,index,arr){
  console.log(arr[index]==val);  // ==> true
  sum+=val            
})
console.log(sum);          // ==> 8

지도

여기서 지도는 '지도'가 아니라 '매핑'을 의미합니다. [].map(); 기본 사용법은 forEach 메소드와 유사합니다:

array.map(callback,[ thisObject]);

콜백 매개변수도 유사합니다.

[].map(function(value, index, array) {
  // ...
});

맵 메소드의 기능은 이해하기 어렵지 않습니다. 즉, 원래 배열을 해당하는 새 배열에 '매핑'하는 것입니다. 다음 예는 숫자 용어의 제곱을 구하는 것입니다.

var data=[1,3,4]

var Squares=data.map(function(val,index,arr){
  console.log(arr[index]==val);  // ==> true
  return val*val           
})
console.log(Squares);        // ==> [1, 9, 16]

참고: forEach와 map은 새 배열을 추가하기 위한 ECMA5 메서드이므로 IE9 이하의 브라우저는 아직 이를 지원하지 않습니다(IE에게). 그러나 위의 모든 기능은 forEach 메서드와 같은 배열 프로토타입을 확장하여 구현할 수 있습니다.

if (typeof Array.prototype.forEach != "function") {
  Array.prototype.forEach = function() {
    /* 实现 */
  };
}

JS의 forEach, $.each, map 메소드에 대한 위의 권장 사항은 모두 편집자가 공유한 내용이므로 참고가 되셨으면 좋겠습니다. Script Home을 지원해 주시길 바랍니다.