JavaScript/ES6+

ES6+ | Array Methods 배열 메서드 간단 정리

pathas 2020. 5. 21. 15:38

every

배열의 모든 요소가 조건에 맞으면 true를, 그렇지 않다면 false를 반환

  • 수행 중 거짓이 나온다면 수행을 멈추고 false 반환

예제

const arr = [2, 3, 4];

const isBiggerThanOne = arr.every((key) => key > 1);

console.log(isBiggerThanOne); // true

find

배열 내에서 특정 요소를 찾는 데 사용하며 조건에 맞는 요소를 반환

예제

const arr = ["node.js", "올인원"];

const res = arr.find((key) => key === "올인원");

console.log(res); // 올인원

includes

배열 내에 특정 요소가 있다면 true를, 그렇지 않다면 false를 반환

예제

const arr = ["node.js", "올인원"];

const res = arr.includes("node.js");

console.log(res); // true

forEach

배열 내의 각 요소에 접근할 수 있도록 도와주는 메서드
주로 하나의 함수를 배열의 각 요소에 대해 실행시키고자 하는 경우 사용

forEach 내부의 코드는 동기로 실행됨

예제

const arr = [1, 2, 3, 4];

const newArr = [];

arr.forEach((item) => newArr.push(item));

console.log(newArr); // [1, 2, 3, 4]

map

배열 내의 모든 요소에 대해 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환

예제

const arr = [1, 2, 3, 4];

const newArr = arr.map((item) => item + 1);

console.log(newArr); // [2, 3, 4, 5];

filter

배열 내의 모든 요소에 대해 테스트를 실행하고, 테스트를 통과한 요소들만 모아서 새로운 배열을 반환

예제

const arr = [1, 2, 3, 4];

const newArr = arr.filter((item) => item > 2);

console.log(newArr); // [3, 4]

ES6에 추가된 배열 메서드들을 간단한 예제와 함께 살펴보았습니다.

map, filter의 경우 리액트에서 많이 사용되기 때문에 두 가지 메서드 정도는 알아두면 좋을 것 같습니다.