JS 기초 : 배열 내장 함수 map

0andme·2021년 7월 27일

JavaScript

목록 보기
9/16

◼ 짚고 넘어가기

const array = [1, 2, 3, 4, 5, 6, 7, 8];

위와 같은 배열의 각 요소의 제곱수를 새로운 배열에 저장하기 위해선 아래와 같이 코드를 작성할 수 있다.

풀이 1. 빈 배열을 만들고 for문을 이용

	const squared = [];
	for (let i = 0; i < array.length; i++) {
	  squared.push(array[i] * array[i]);
	}

map 메서드를 사용하면 코드를 더 줄일 수 있다.


위의 예제를 map메세드로 작성해보자

◼ Map

  • Map 메서드는 배열의 모든 요소를 이용하여 새로운 배열을 반환하는 메서드이다.
  • 배열명.map(파라미터)형태로 작성한다.

풀이 1. 파라미터 부분에 함수명

	const square = (n) => n * n;
	const squared = array.map(square);

풀이 2. 파라미터 부분에 함수 그대로

	const squared = array.map((n) => n * n);

배열의 각 요소를 n에 불러오고 n * n에 해당되는 값을 새로운 배열에 저장한 것이다 .

위의 예제는 n에 해당되는 값이 숫자였다. 아래는 n이 객체의 요소일 때의 예제이다.
예제

const items = [
  {
    id: 1,
    text: "hello"
  },
  { id: 2,
   text: "bye"
  }
];

const texts = items.map((n) => n.text);

items의 객체 요소를 n에 불러와서 n.text에 해당되는 요소들만 새로운 배열 texts에 저장한 것이다.


◼ 요약

  • 배열명.map(파라미터)형태로 작성한다.
  • map 메서드는 새로운 배열을 반환한다.

profile
개발이 하고 싶어? 정말 하고 싶긴 한거야?

0개의 댓글