JavaScript 배열 메서드를 알아보자

✍🏼 .map() - 모든 요소에 주어진 함수를 호출한 결과로 새로운 배열을 만든다.

배열에 사용 가능하며, 변수명.map((el)=>(수행할 로직)) 형태로 사용한다.

const classmates = ["철수","영희","훈이"]

classmates.map((el)=>(el + "어린이"))	

//배열에 적용한 결과 : ["철수어린이","영희어린이","훈이어린이"]

객체로 구성된 배열에 적용하려면 각 요소 값을 기입하고 추가로 수행할 로직을 작성해준다.

const info = [
  {name : "철수", age : 10},
  {name : "철수", age : 10},
  {name : "철수", age : 10}
]

info.map((el) => (
  {name : el.name, age : el.age, school : "다람쥐초등학교"}
))

//결과 : [
//  {name : "철수", age : 10, school : "다람쥐초등학교"},
//  {name : "철수", age : 10, school : "다람쥐초등학교"},
//  {name : "철수", age : 10, school : "다람쥐초등학교"}
//]

모든 요소에 동일한 로직을 수행하기때문에 반복문으로 활용할 수 있다.

✍🏼 .filter() - 모든 요소에 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환한다.

변수명.filter((el)=>(요소에 적용할 조건)) 형식으로 작성한다.

const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];

const result = words.filter(word => word.length > 6);

console.log(result);

//결과 : ["exuberant", "destruction", "present"]

//요소의 길이가 6이상인 값을 모아 result라는 새 배열 생성

💡TIP !
.filter()와 .map()을 함께 적용시켜 for문과 if문을 사용할 상황에 코드를 간략하게 작성할 수 있으니 익혀두자.

.filter()로 조건에 충족하는 요소를 거르고(=if문), .map으로 요소에 동일한 로직을 적용(=for문)

✍🏼 .every() - 모든 요소가 주어진 조건을 충족하는지 확인해 boolean값으로 반환한다.

변수명.every((el)=>(요소를 판단할 조건)) 형식으로 작성한다.

const isBelowThreshold = (currentValue) => currentValue < 40;

const array1 = [1, 30, 39, 29, 10, 13];

console.log(array1.every(isBelowThreshold));
// 결과: true

여기서 array1 의 모든 인덱스 값이 40보다 작기때문에 조건을 충족한다.
그래서 true 값을 결과로 반환했고, 하나의 인덱스 값이라도 40을 넘으면 false를 반환한다.

💡 TIP !
빈 배열에서 every() 메서드 적용 시 어떤 조건이든 true를 반환한다.

끝으로,
알고리즘 문제로 어느정도 if와 for문 사용에 익숙해졌다면 같은 문제에 대신.map()과 .filter()를 적용하는 등 MDN( => .map 메서드 관련 정보로 연결)을 자주 참고해 다양한 메서드를 활용할 수 있도록 하자.