Array.filter()

filter 메소드는 오프라인 수업 때 강의를 해야 될 메소드니까 조금 자세하게. 필터 메소드는 배열 메소드로, 주어진 함수의 테스트를 통과하는 요소만 모아 새로운 배열에 담아서 반환한다. 메소드이니까 당연히 함수일 것이고, 주어진 함수의 테스트를 통과해야 하니 당연히 콜백 함수가 들어갈 것이다.

구문은 이렇다.
arr.filter(callback(element[, index[, array]])[, thisArg])

뒤에 나오는 [ ] 구문은 옵션으로, 있어도 되고 없어도 되지만 앞에 있는 element 인수는 무조건 있어야 한다.

• callback은 콜백 함수로, 이름을 callback로 붙이지 않고 다른 이름을 붙이거나 익명 함수로 사용해도 된다.
• element는 arr의 요소 중, 처리할 현재 요소를 뜻한다. 함수가 한 번 돌 때마다 하나씩 거친다.
• index는 처리할 현재 요소의 인덱스를 나타낸다.
• array는 filter 함수를 호출한 배열을 나타낸다.
• thisArg는 callback을 사용할 때 this로 사용하는 값을 나타낸다.
• 삭제되거나 할당되지 않은 값에 대해서는 돌지 않는다.

반환 값은 콜백 함수의 테스트를 통과한 모든 요소가 담긴 새로운 배열이며, 전부 통과할 수 없게 된 경우엔 빈 배열을 반환한다.

이 메소드는 IMMUTABLE한 메소드이므로 원본에 전혀 영향을 주지 않기 때문에 새로운 변수에 담아야 한다.

보통은 filter를 사용할 때 element 정도만 사용한다.

filter를 사용하는 방법은 여러 가지가 있다. 이 방법은 filter의 콜백 함수를 어떻게 쓰느냐에 따라서 달라진다.

1. 콜백 함수를 선언한 경우

let num = [10, 20, 30, 40, 50];
function isLargerThan10 (ele) { return ele > 10; }
let result = num.filter(isLargerThan10);
result;

2. 콜백 함수를 안에 쓸 경우

let num = [10, 20, 30, 40, 50];
let result = num.fileter(function(ele) { return ele > 10; });
result;

3. 콜백 함수를 화살표로 쓸 경우 (ES6)

let num = [10, 20, 30, 40, 50];
let result = num.filter(ele => ele > 10);
result;