안녕하세요!

오늘은 filter에 대해 알아보도록 하겠습니다

리액트를 공부하고 있는데 무슨 뒷북이냐구요?

다 저의 잘 못 입니다 ㅜㅜ

네 ㅜ 외면하고 싶었습니다 도저히 이해가 안돼서...

하지만 계속 외면을 할 수는 없었고 map 꼴이 날 것 같아서

도저히 안되겠다 생각하고 filter에 대해 공부하기 시작했습니다

예전에 이해 안됐던 것들이 또 다른 공부를 하면서 필요로 인해서 찾아보니깐 또 이해가 되는 경우도 있더라구요..ㅎ

네 그러면 filter에 대해 알아보도록 하겠습니다!

filter가 뭔가요?

말 그대로 걸러주는 함수 입니다

우리가 정수기 필터 이런 것들 많이 들어보셨죠?

정수기에 필터 덕분에 불순물들을 걸러주고 원하는 맑고 깨끗한 물을 마실 수 있듯이 자바스크립트에서도 filter는 내가 원하는 것들을 걸러주는 기능을 해줍니다

어떻게 사용해요?

먼저 filter 기본 구조에 대해 알아보도록 하겠습니다

const newArr = arr.filter(( elemnent, index, array ) => { ··· });

이렇게 기본 구조를 가질 수 있습니다

하지만 우리는 보통 array 를 많이 사용하긴 하죠

예시를 한 번 들어볼까요?

const arr = [{id: 1, fruit: '사과'}, {id: 2, fruit: '오렌지'}];

위와 같은 코드가 있을 때

나는 id의 값이 2가 아닌 배열을 나타내고 싶어 라고 하면

arr.filter(choice => {
	return choice.id !== 2;
})

위와 같은 코드로 우리는 {id: 1, fruit: '사과'} 만 가져올 수 있습니다

물론 저기서 적은 choice는 다른 단어로 교체 후 진행하셔도 무관합니다!

그럼 값을 내보내는건 true인 상태 값만 내보내는거네요?

네! 맞습니다!!

filter는 무슨 값만 내보내죠! 이런 느낌보단 내가 이런 조건의 필터를 만들었으니깐 여기에 안걸러지는 애들(true)만 내보내줘 라고 생각하시면 됩니다

네 오늘은 이렇게 간단하게 filter에 대해 알아보았는데요

오늘은 간단하게만 알아보았고 조금 더 공부를 하면서 응용하는 부분이 있다면 충분히 이해해서 꼭 쉽게 포스팅할 수 있도록 하겠습니다!

그러면 오늘은 이렇게 여기서 마무리 하도록 하겠습니다!

오늘도 빠이팅이고

그러면 우리는 또 행복하자구요!

profile
디자이너의 코딩 도전👍🏻

0개의 댓글

Powered by GraphCDN, the GraphQL CDN