오늘은 배열 메서드 중 filter(), map(), every()를 알아보자.
Array.filter()
filter 메서드는 배열을 순회하며 배열의 모든 요소를 filter메서드의 파라미터로 들어오는 callbackFunciton의 입력으로 넣었을 때 callbackFuntion의 조건을 통과해 반환값으로 true를 리턴해주는 요소들을 모아서 새로운 배열에 할당한 뒤 그 배열을 반환한다. callbackFuntion의 조건을 통과하지 못한 요소들은 새로운 배열에 포함시키지 않는다.
새로운 배열을 만들기 때문에 원본 배열이 수정되지 않는 메서드이다.
const numArray = [1, 20, 3, 40, 5, 60];
const mySexyFilter = (num) => {
return num > 33;
}
const result = numArray.filter(mySexyFilter);
console.log(result);
// 결과 : [40, 60]또는 아래와 같이 화살표 함수로 간단하게 사용할 수 있다.
const numArray = [1, 20, 3, 40, 5, 60];
const result = numArray.filter((num) => num > 33);
console.log(result);
// 결과 : [40, 60]Array.map()
map 메서드는 배열을 순회하며 배열의 모든 요소를 map메서드의 파라미터로 들어오는 callbackFuntion의 입력으로 넣었을 때 callbackFuntion을 적용한 리턴값을 반환하여 새로운 배열에 할당한 뒤 그 배열을 반환한다.
map 메서드 또한 새로운 배열을 만들어 반환하기 때문에 원본 배열이 수정이 되지 않는다.
const numArray = [1, 2, 3];
const myMapFunction = (num) => {
return num * 2;
}
const result = numArray.map(myMapFunction);
console.log(result);
// 결과 : [2, 4, 6]아래와 같이 화살표 함수로 간단하게 사용할 수 있다.
const numArray = [1, 2, 3];
const result = numArray.map((num) => num * 2);
console.log(result);
// 결과 : [2, 4, 6]Array.every()
every 메서드는 배열을 순회하며 배열의 모든 요소를 every메서드의 파라미터로 들어오는 callbackFuntion의 입력으로 넣었을 때 callbackFuntion의 조건을 모두 통과하는지 판별한 후 결과값으로 boolean을 반환한다. 모두 통과한다면 true를 반환하고 하나라도 통과하지 못한다면 false를 반환한다. every 메서드는 모든 배열의 요소에 대하여 false를 반환하는 요소를 찾을 때까지 순회한다. false를 찾는 즉시 반환하며 순회를 멈춘다.
참고로, 빈 배열에서 호출하게 되면 무조건 true가 반환된다.
const numArray = [2, 4, 6, 8, 5, 10, 12];
const isAllEven = (num) => {
return num % 2 === 0;
}
const result = numArray.every(isAllEven);
console.log(result);
// 결과 : false ( numArray의 4번 인덱스 요소인 5에서 false를 반환하고 순회를 멈춤. )아래와 같이 화살표 함수로 간단하게 사용할 수 있다.
const numArray = [2, 4, 6, 8, 5, 10, 12];
const result = numArray.every((num) => num % 2 === 0);
console.log(result);
// 결과 : false