filter
- 배열의 데이터를 반복하는데 조건에 맞는 요소만 걸러낼 때 사용한다
- 함수를 매개변수를 받는데 (콜백함수) return값이 true나 false 여야 한다
- 콜백 함수의 return 값이 true면 리스트에 남고 false면 필터링 된다
// 나이가 13살 이상인 사람만 필터링 하는 함수
const check = (value, index, array) => {
return value.age > 12;
}
const result1 = array.filter(check);
console.log("result1");
console.log(result1);

map
- 배열의 데이터를 반복하는데 기존의 데이터 형식을 다른 형식으로 변경할 때 사용
- 함수 매개변수를 받는데 (콜백함수) return 값이 어느 것이든 될 수 있다
- map은 객체 Map하고 전혀 상관이 없으니 주의
- 기존의 객체 배열 -> 이름만 있는 문자열 배열로 전환
const result2 = array.map((value, index, array)=>{
return value.name;
});
console.log("result2");
console.log(result2);

연습
forEach - name님 안녕하세요 반복출력
filter - 이름이 '길'자가 들어간 사람만 남기기
map - 나이만 뽑아서 숫자 배열 만들기
//forEach - name님 안녕하세요 반복출력
console.log("forEach");
array.forEach((value)=>{
console.log(value.name + "님 안녕하세요")
});
// filter - 이름이 '길'자가 들어간 사람만 남기기
console.log("filter");
const result3 = array.filter((value)=>{
return value.name.includes('길');
});
console.log(result3);
// map - 나이만 뽑아서 숫자 배열 만들기
console.log("map");
const result4 = array.map((value)=>{
return value.age;
});
console.log(result4)
return이 한줄이면 중괄호가 없어도 된다.
const array = [
{name : "홍길동", age : 12},
{name : "임꺽정", age : 13}
];
//forEach - name님 안녕하세요 반복출력
console.log("forEach");
array.forEach((value)=>console.log(value.name + "님 안녕하세요"));
// filter - 이름이 '길'자가 들어간 사람만 남기기
console.log("filter");
const result3 = array.filter((value)=>value.name.includes('길'));
console.log(result3);
// map - 나이만 뽑아서 숫자 배열 만들기
console.log("map");
const result4 = array.map((value)=> value.age);
console.log(result4)

'프로그래밍 언어와 기술 > JavaScript' 카테고리의 다른 글
| [JavaScript] setTimeout, setInterval (0) | 2023.07.11 |
|---|---|
| [JavaScript] alert, confirm, prompt (0) | 2023.07.11 |
| [JavaScript] 전개 연산자 (0) | 2023.07.11 |
| [JavaScript] 함수가 들어가는 메소드, 구조 분해 할당 (0) | 2023.07.11 |
| [JavaScript] 반복문 (0) | 2023.07.11 |