filter / map / every

kimdev·2022년 5월 22일
0
이번엔 배열의 메소드 3가지에 대해 배워보자!

배열의 메소드는 정말 많지만 이번엔 자주쓰이는 3가지를 배워볼것이다.

filter/map/every가 있는데 웹에서의 사용법은 다루지 않겠다.

메소드의 사용법만을 익히고 웹에서의 활용은 스스로 생각하며 범위를 넓게 잡아보자.

filter(출처/MDN)

필터 메소드란? 

주어진 함수의 테스트를 모두 통과하는 값들을 새로운 배열!! 로 만든다.

새로운 배열을 만들어 주는것이다. 메소드에 대해 배울때 리턴이 어떻게 돌아오는지 집중하며
배우는게 좋다고 한다.

filter예시

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

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

console.log(result);
// 출력 : Array ["exuberant", "destruction", "present"]

words.filter(word => word.length > 6) // 인자값의 길이가 6 이상이라면 통과

map

맵은 배열 내의 모든 요소 각각에 대하여 주어진 
함수를 호출한 결과를 모아 새로운 배열!!을 반환한다.

수업에선 api의 리턴값을 반복적으로 보여주는 게시글목록을 만들때 사용했다.

map예시

const array1 = [1, 4, 9, 16];

const map1 = array1.map(x => x * 2);

console.log(map1);
// 출력 : Array [2, 8, 18, 32]

every

every메소드는 비교적 생소하게 느껴졋다.
다른 메소드는 얼추 활용을 어디에 할지 생각이 나는 반면
every메소드는 감이 잡히질 않앗다.

every
	배열의 모든 요소가 주어진 판별을 모두 통과하는지 확인한다.
    
    통과한다면 true 아니라면 false로 boolean타입 데이터로 결과를 반환해준다.

Every예시

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

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

console.log(array1.every(isBelowThreshold));
// 출력: true

0개의 댓글