filter() 메서드는 주어진 판별 함수를 통과하는 요소를 모아 새로운 배열로 만들어 반환합니다.

forEach() 메소드처럼 배열 내 각 요소에 함수를 적용할 수 있는데, 다른 점은 함수를 통해 반환된 결과를 모아 새로운 배열을 만들어준다는 것이다.



1
2
3
4
5
6
7
8
9
10
11
12
13
14
let toDos = [];
 
function deleteToDo(event){
    const btn = event.target; #버튼 태그 지정
    const li = btn.parentNode; #버튼이 포함된 리스트
 
    toDoList.removeChild(li); #리스트 제거
 
    const cleanToDos = toDos.filter(function(toDo){
        return toDo.id !== parseInt(li.id); #리스트에서 제거된 id와 다른 값들로 새 배열 추가
    });
    toDos = cleanToDos; #새 배열 저장
    saveToDos(); #로컬스토리지에 문자열로 파싱 후 저장
}
cs


toDoList는 html 상에서 작성한 toDo가 출력되는 리스트인데,


그 중 하나의 toDo를 삭제하여, 그 toDo가 가진 id 값과 toDos 변수인 배열 안에 객체들의 id 값을 비교하는데,

배열 안에서 id 값이 다른 것들만 따로 모아 새로운 이름(cleanToDos)의 배열을 만든다는 것이다.


아직 설명하는 방법도 어려울 정도이다.


인강 들으면서 가장 이해 안되었던 부분이다. 이해하는데 정말 오랜 시간이 걸린듯;






출처

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/filter

블로그 이미지

쵸잇

,