filter()

nada_1221·2022년 7월 30일
0

공부

목록 보기
23/49

arr.filter() 메서드는 내장 된 메서드로, 이 메서드는 주어진 기준과 조건을 따르거나 통과하는 요소로 새 배열을 만든다.

array.filter(callback(ele[,idx[,arr]])[,thisValue])

매개변수 : 이 메서드는 위에서 언급하고 아래에 설명된 대로 5개의 매개변수를 허용한다.

  • callback : 이 매개변수는 배열의 각 요소에 대해 호출할 함수를 보유.
  • element : 매개변수는 현재 처리 중인 요소의 값을 보유
  • index : 이 매개변수는 선택사항이며, 0부터 시작하는 배열의 currentValue 요소 인덱스를 보유
    - arr : 이 매개변수는 선택사항이며 Array.every가 호출되는 전체 배열을 보유
  • thisValue : 이 매개변수는 선택 사항이며 콜백 함수를 실행하는 동안 사용할 컨텍스트로 전달된다. 컨텍스트가 전달되면 콜백 함수의 각 호출에 대해 이와 같이 사용되며, 그렇지 않으면 undefined가 기본 값으로 사용된다.
  • return value : 이 메서드는 Argument(전달 인자) function 의 조건을 충족하는 요소로만 구성된 새 배열을 반환.
/*이 예에서 filter() method는 canVote() 함수로 검사한 조건을 충족하는 요소로만 구성된 새 배열을 만든다.*/

function canVote(Age){
  return age >= 18;
}

function func() {
  let filtered = [24, 33, 16, 40].filter(canVote);
  document.write(filtered);
}

func();
/// === [24, 33, 40]
/*이 예에서 filter() method는 isPositive() 함수로 검사한 조건을 충족하는 요소로만 구성된 새 배열을 만든다.*/

function isPositive(value){
  return value >0;
}

let filtered = [112, 52, 0, -1, 944].filter(isPositive);
prin(filtered)

//=== [112,52,944]
/*이 예에서 filter() method는 isEven() 함수로 검사한 조건을 충족하는 요소로만 구성된 새 배열을 만든다.*/
function isEven(value){
  return value % 2 == 0;
}

let filtered = [11, 98, 31, 23, 944].filter(isEven);
print(filtered);

//=== [98,944]

ES6.ver

/*길이가 5보다 큰 배열의 모든 단어를 필터링 한다.*/
let words = ["hi","hello","hey","apple","watermelon","lemon","javascript"];
let result = words.filter(word => word.length >5);
console.log(result);

// === ["watermelon","javascript"]
let jsonarr = [
    {
        id: 1,
        name: "joe"
    },
    {
        id: -19,
        name: "john"
    },
    {
        id: 20,
        name: "james"
    },
    {
        id: 25,
        name: "jack"
    },
    {
        id: -10,
        name: "joseph"
    },
    {
        id: "not a number",
        name: "jimmy"
    },
    {
        id: null,
        name: "jeff"
    },
]

let result = jsonarr.filter(user => user.id >0);

console.log(result);

// === [{"id":1,"name":"joe"},{"id":20,"name":"james"}, {"id":25,"name":"jack"}]

원문 출처 | https://www.geeksforgeeks.org/es6-array-filter-method/

profile
FE_개발자_지망생

0개의 댓글