TIL(Map 함수)

Seungbin Lee·2024년 5월 21일

map() 함수

map() 함수는 배열을 순회해서 각 요소를 콜백 함수로 적용해서 처리해 
모은 새로운 배열을 반환하기 위한 함수이다.
map() 함수에 전달되는 콜백 함수는 "각 요소를 변환하여 
새로운 배열로 매핑(mapping)하는 역할을 한다"라고 말한다.
이렇게 매핑된 결과를 새로운 배열로 반환하기 때문에 
이 함수의 이름이 "map"으로 정해졌다.

구문

arr.map(function(currentValue[, index[, array]]) {
    // 변환(mapping)할 로직: 변환된 결과를 반환해야 합니다.
}[, thisArg]);

예시

// 숫자 배열을 받아 각 숫자를 두 배로 만들어 새로운 배열을 생성하는 map() 함수
const numbers = [1, 2, 3, 4, 5];

const doubledNumbers = numbers.map(function(number) {
    return number * 2; // 매핑된 결과를 새로운 배열로 반환
});

console.log(doubledNumbers);
// 출력: [2, 4, 6, 8, 10]
const numbers = [1, 2, 3, 4, 5];

const squaredNumbers = numbers.map(function(number) {
    return number * number;
});

console.log(squaredNumbers);
// 출력: [1, 4, 9, 16, 25]

매개변수

function	
arr 배열의 각 요소에 적용할 때 호출되는 콜백 함수이다. 
이 함수는 세 개의 매개변수를 가질 수 있다.
currentValue (필수): 
처리할 현재 요소. 
이 매개변수를 통해 현재 요소에 접근할 수 있다.
index (옵션): 
처리할 현재 요소의 인덱스. 
이 매개변수를 사용하여 현재 요소의 인덱스에 접근할 수 있다.
array (옵션): 
map() 함수를 호출한 배열. 
이 매개변수를 사용하여 원본 배열에 접근할 수 있다.
thisArg	(옵션):
function을 실행할 때 this로 사용할 객체. 
이 매개변수는 필요에 따라 사용됩니다.

반환 값

배열의 각 요소에 대해 실행한 function의 결과를 모은 새로운 배열을 반환합니다.

구현 설명

map() 함수는 arr 배열의 요소를 순서대로 한 번씩 순회하면서 
function 함수를 호출하고, 함수의 반환 값을 새로운 배열에 모아서 반환합니다. 
이를 통해 각 요소를 변환하거나 조작하여 새로운 배열을 생성할 수 있습니다. 
map() 함수는 원본 배열을 변경하지 않으며, 
변환 작업을 수행하여 새로운 배열을 생성하는 기능을 제공합니다.

0개의 댓글