반응형
map() 메서드
map() 메서드는 배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환합니다.
구문
arr.map(callback(currentValue[, index[, array]])[, thisArg])
매개변수
- callback: 새로운 배열 요소를 생성하는 함수( 아래 세 가지 인수를 가집니다. )
- currentValue: 처리할 현재 요소
- index: 처리할 현재 요소의 인덱스
- array: map()을 호출한 배열
- thisArg: callback을 실행할 때 this로 사용되는 값
반환 값
배열의 각 요소에 대해 실행한 callback의 결과를 모은 새로운 배열
예제
배열에 들어있는 숫자들의 제곱근을 구하여 새로운 배열을 만들기
let number = [1, 4, 9, 21];
let roots = number.map(Math.sqrt);
console.log(number); // [1, 4, 9, 21]
console.log(roots); // [1, 2, 3, 4.58257569495584]
map()을 활용해 배열 속 객체를 재구성하기
let kvArr = [
{ key: 1, value: 10 },
{ key: 2, value: 20 },
{ key: 3, value: 30 }
];
let reformttedArr = kvArr.map(function (obj) {
let rObj = {};
rObj[obj.key] = obj.value;
return rObj;
});
console.log(kvArr); // [{key:1, value: 10}, {key:2, value: 20}, {key:3, value: 30}]
console.log(reformttedArr); // [{1: 10}, {2: 20}, {3: 30}]
인자를 받는 함수를 사용하여 숫자 배열 재구성하기
let number = [1, 2, 5, 8, 20];
let double = number.map(function (num) {
return num * 2;
});
console.log(number); // [1, 2, 5, 8, 20]
console.log(double); // [2, 4, 10, 16, 40]
map()을 포괄적으로 사용하기
:: ASCII 인코딩 값을 요소로 갖는 배열을 얻는 방법입니다.
let map = Array.prototype.map;
let a = map.call("Hello World", function (x) {
return x.charCodeAt(0);
});
console.log(a); // [72, 101, 108, 108, 111, 32, 87, 111, 114, 108, 100]
반응형
'JavaScript | TypeScript > javascript 문법' 카테고리의 다른 글
| [ Javascript ] Array.prototype.lastIndexOf() (0) | 2023.02.23 |
|---|---|
| [ Javascript ] Array.prototype.keys() (0) | 2023.02.10 |
| [ Javascript ] Array.prototype.join() (0) | 2023.02.05 |
| [ Javascript ] Array.isArray() (0) | 2023.02.01 |
| [ Javascript ] Array.prototype.indexOf() (1) | 2023.01.27 |