Array.filter()

JA_X·2023년 3월 27일
0

Array Method

목록 보기
2/2

Array.filter()

자바스크립트의 filter함수는 배열의 각 요소를 순회하며 callback함수를 실행하며 조건에 맞는 요소만을 갖는 새로운 배열을 반환합니다.

const newArray = arr.filter(callbackFunction(element, index, array), thisArg);

callback 함수는 3개의 매개변수 사용 가능
element : 요소 값
index : 요소의 인덱스
array : 사용되는 배열 객체

예제

  1. 배열 안 숫자 중 홀수만 갖는 배열 반환
// 배열 안 숫자 중 홀수만 갖는 배열 반환
const numbers = [1, 2, 3, 4, 5]; // 기존 배열

// filter1 - callback함수를 직접 작성
// 현재 요소를 2로 나눈 나머지가 1일 경우 홀수
const filter1 = numbers.filter(currentNumber => currentNumber % 2 === 1);

console.log('filter1 =', filter1); // filter1 = [1,3,5]

또는

// filter2 - callback함수 선언 후 이용
function isOdd(currentNumber) {
  return currentNumber % 2 === 1;
}

const filter2 = numbers.filter(isOdd);

console.log('filter2 =', filter2); // filter2 = [1,3,5]
  1. 오브젝트 배열 속 원하는 요소만 갖는 배열 반환
const friends = [
  {
    name: '양주진',
    age: 32,
    job: '코인러',
    married: false,
  },
  {
    name: '오영제',
    age: 32,
    job: '랩퍼',
    married: false,
  },
  {
    name: '서준형',
    age: 32,
    job: '2년차 유부남',
    married: true,
  }
];

// 자유인들만 뽑아봅시다.
const happyPeople = friends.filter((friend) => {
  
  return friend.married === false;
})

console.log(happyPeople);
/*
[
  {
    name: '양주진',
    age: 32,
    job: '코인러',
    married: false
  },
  {
    name: '오영제',
    age: 32,
    job: '랩퍼',
    married: false
  }
];
*/

0개의 댓글