오늘은 ECMA5 javascript 메소드 중에 하나인 map에 대해서 포스팅 하고자 한다. map메소드는 Array객체의 프로토타입 프로퍼티에 존재하는 메소드다. (즉 모든 배열에서 사용 가능하다.) 이 메소드는 배열의 각 요소들에 대해서 인자로 넘기는 함수를 실행시키고, 해당 배열을 리턴으로 반환한다.

1
array.map(function(currentValue,index,arr), thisValue)

위에서 볼 수 있듯이 콜백함수에 첫번째 값으로 요소의 값을, 두번째로 인덱스, 세번째로 배열 자체를 넘긴다. 아래는 제곱근을 구하는 예제이다.

1
2
3
4
5
var numbers = [4, 9, 16, 25];
var sq = numbers.map(function(val, idx){
  return Math.sqrt(val);
});
console.log(sq);//[2, 3, 4, 5]

map은 원래의 배열에 영향을 미치지는 않는다. 따라서 다시 numbers를 콘솔로 찍으면 원래 값([4, 9, 16, 25])을 반환한다.

ECMA3에서 map메소드는 없지만, 다음과 같이 스크립트를 활용해 만들 수 있다.

1
2
3
4
5
6
7
8
9
if(!Array.prototype.map){
  Array.prototype.map = function(a, f){
    var results = [];
    for (var i = 0, len = a.length; i < len; i++) {
      if(i in a) results[i] = f.call(null, a[i], i, a);
    }
    return results;
  };
}