2022-05-31 / js array.find 그리고 array.filter

react를 쓰다보면 map과 filter에 심취한 나머지 다른 메소드의 존재를 잊을 때가 있다.

 

그럴 때 마다 주로 깜빡하는 메소드가 find이다.

 

배열에서 찾는 요소를 배열로 만들어 가져오는 것에 익숙해져서 내가 무슨 작업을 하는 것인지, 뭘 해야하는지 잊는 것이다.

 

const numArray = [1,2,3,4,5];

const iFoundTargetNum = numArray.filter(num => num === 3)[0];

// 1,2,3,4,5 모두 검사

이렇게 하나의 아이템만을 찾는데 Array.filter를 도는 것은 전기 낭비, 메모리 낭비 이다. 

 

조건에 맞는 아이템 하나만 찾아서 바로 리턴해주면 되는 일을 배열의 모든 요소를 돌아서 찾을 필요는 없다.

const numArr = [1,2,3,4,5];

const iFoundTargetNum = numArr.find(num=>num === 3);

// 1 아니고 2아니고 3 리턴

Array.find는 조건에 맞는 첫 번째 요소를 리턴해준다. 때문에 filter보다 효율적으로 요소를 찾을 수 있다.