Filter

입점사 프로젝트를 진행하며 페이지네이션과 함께 많이 쓰인 것은 필터일 것이다! 각 페이지에서 데이터를 조회하기 위해 필터와 페이지네이션이 사용되었다. 각각의 페이지마다 필터 컴포넌트로 만들면서 그에 대한 로직이 반복되어 이를 개선하고 뒤로가기 또는 새로고침 시 필터값을 유지하는 방법을 알아보겠다! 필터 컴포넌트와 필터 관련 hook 구현하기 필터 컴포넌트 초기 필터값들과 검색, 초기화 시 동작되는 함수를 전달 받는다. 사용자가 입력한 필터값을 내부적으로 관리한다. src/components/filter/deliveryTemplateFilter.tsx interface DeliveryTemplateFilterProps { initialFilterValues: FormState onSubmit: (filte..

배열 안에 내가 원하는 객체를 찾고 싶어 나는 filter를 사용해서 찾아줬다. 여기서 find로도 찾을 수 있지 않나? 하는 생각이 들어 둘이 뭐가 다른 건지 차이점이 궁금했다. 결론부터 말하자면 filter()는 만족하는 모든 요소들을 모아 새로운 배열로 반환한다. find()는 만족하는 첫 번째 요소의 값을 반환하고 그 요소가 없다면 undefined를 반환한다. filter() const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present']; const result = words.filter(word => word.length > 6); console.log(result); // expected output: Arra..