JS. Filter & Some & Every 메서드

MJ·2023년 4월 27일
0

Java Script

목록 보기
51/57
post-thumbnail

Filter

  • 요소로 구성된 배열에서 필터링을 하거나 부분 집합을 모아서 새로운 배열을
    생성할 때 사용되는 메서드

  • 비파괴 메서드 ( 원본수정 X )


const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14];

const newnumbers = numbers.filter( (n) => (n < 10) );

console.log(newnumbers);
/* 
출력 : 
[
  1, 2, 3, 4, 5,
  6, 7, 8, 9
]

numbers 배열안의 요소들을 전부 확인하고 10보다 작은 요소들만, 새로운 배열에 저장해서
newnumbers 변수에 할당합니다.
*/

const movie = [
    {
        name: '어벤져스',
        score: 95,
        year: 2010
    },

    {
        name: '킹콩',
        score: 92,
        year: 2010
    },

    {
        name: '컨저링',
        score: 100,
        year: 2010
    },

    { 
        name: 'B급영화',
        score: 50,
        year: 1990
    },
    
    {
        name: 'C급영화',
        score: 20,
        year: 1980
    }
]

const goodMoive = movie.filter( m => m.score > 90 );
const badMoive = movie.filter( m => m.score < 80 );
/* 
movie 배열에서 score 점수가 90점 초과인 객체들만 필터링해서 goodmovie 변수에 저장
movie 배열에서 score 점수가 80점 미만인 객체들만 필터링해서 badmovie 변수에 저장
*/

console.log(goodMoive);
console.log(badMoive);
/*
출력 : 
[
  { name: '어벤져스', score: 95, year: 2010 },
  { name: '킹콩', score: 92, year: 2010 },
  { name: '컨저링', score: 100, year: 2010 }
]
[
  { name: 'B급영화', score: 50, year: 1990 },
  { name: 'C급영화', score: 20, year: 1980 }
]
*/

1.1 Map 메서드와 같이 사용


const movie = [
    {
        name: '어벤져스',
        score: 95,
        year: 2010
    },

    {
        name: '킹콩',
        score: 92,
        year: 2010
    },

    {
        name: '컨저링',
        score: 100,
        year: 2010
    },

    {
        name: 'B급영화',
        score: 50,
        year: 1990
    },

    {
        name: 'C급영화',
        score: 20,
        year: 1980
    }
]

const goodMoive = movie
    .filter(m => m.score > 90)
    .map(m => m.name);
// 한줄에 모두 입력하기 힘든 경우에는, 여러줄로 나누어서 작성해도 된다.

console.log(goodMoive);
/* 
출력 : 
[ '어벤져스', '킹콩', '컨저링' ]


1. movie 배열에 있는 요소중에서 filter 메서드로 점수가 90점 이상만 필터링 
2. 90점이상의 요소들 중에서 map 메서드로 프로퍼티가 name인 요소들만 새로운 배열로 만들어
	goodMovie 변수에 저장한다.
*/



every

  • 논리형 메서드로 참이나 거짓 값을 판단해서 반환합니다.

  • 배열내의 모든 요소가 every를 통해 테스트를 거치고 참/거짓을 반환한다.
    모든 요소가 참이라면 true, 하나라도 거짓이 있다면 false를 반환합니다.


const exams = [90, 80, 75, 60, 50, 10, 20, 30, 100];

const result = exams.every(score => score >= 75);

console.log(result);

/* 
출력 : false

배열안의 있는 모든 요소가 75이상이여야 true가 출력된다.
*/



some

  • every 메서드와 작동방식이 매우 비슷하지만, 한가지 차이점은 요소중에서 하나 또는
    일부가 테스트를 통과하는지 여부를 테스트한다.

  • every 메서드처럼 배열의 모든 요소를 테스트하지 않고, 하나라도 통과된다면 참이 반환
    된다.

const exams = [90, 80, 75, 60, 50, 10, 20, 30, 100];

const result = exams.some(score => score >= 75);

console.log(result);
/*
출력 : true

배열안의 요소중에서 하나라도 참에 해당된다면 true가 출력된다.
*/
profile
프론트엔드 개발자가 되기 위한 학습 과정을 정리하는 블로그

0개의 댓글