[역할]
filter 메서드는 JavaScript의 배열 메서드 중 하나로, 주어진 조건에 따라 배열의 요소들을 필터링하여 새로운 배열을 반환한다. 이 메서드는 원본 배열을 변경하지 않고, 조건에 맞는 요소들로 이루어진 새로운 배열을 생성하는 특징이 있다.
[구조]
let newArray = array.filter(callback(element[, index[, array]])[, thisArg]);
매개변수
- callback(element[, index[, array]]): 배열의 각 요소에 대해 호출되는 함수.
- element: 현재 처리 중인 요소.
- index (선택적): 현재 처리 중인 요소의 인덱스.
- array (선택적): filter 메서드가 호출된 배열 자체.
- thisArg (선택적): callback 함수 내부에서 this로 사용할 값.
반환 값
filter 메서드는 조건을 만족하는 요소들로만 구성된 새로운 배열(newArray)을 반환한다.
콜백 함수의 반환 값
callback 함수는 true (새로운 배열에 포함) 또는 false(새로운 배열에 포함X) 를 반환해야 한다.
[예시1]
const numbers = [1, 2, 3, 4, 5, 6];
const evenNumbers = numbers.filter(number => number % 2 === 0);
console.log(evenNumbers); // [2, 4, 6]
[예시2]
const ui = {
rpData: {
OutRec1: {
RCRD_C: 5 // 예제 데이터
},
OutRec2: [
{ HNGL_ISNM: "John" },
{ HNGL_ISNM: null },
{ HNGL_ISNM: "Doe" },
{ HNGL_ISNM: null },
{ HNGL_ISNM: "Smith" }
]
}
};
// HNGL_ISNM이 null이 아닌 항목만 필터링하여 새로운 배열 생성
const filteredOutRec2 = ui.rpData.OutRec2.filter(item => item.HNGL_ISNM !== null);
// 필터링된 배열 확인
console.log(filteredOutRec2);
//배열을 돌면서 필터링 된 항목 출력
filteredOutRec2.forEach(item => {
console.log(item.HNGL_ISNM);
});
'Front > javascript' 카테고리의 다른 글
JS spread operator 스프레드 연산자(...) (1) | 2024.07.03 |
---|---|
[Javascript] 요소를 복사하여 사용하기 - JS clone (0) | 2024.06.28 |
Dayjs 사용법 (0) | 2023.08.17 |
ifram 동영상 컨트롤 하기 (0) | 2023.05.08 |
[Javascript] 웹 페이지의 근육 심기 - DOM 요소 추가와 삭제 (0) | 2023.03.26 |