느릿늘있

[JS] 배열 탐색 : forEach, filter, find 본문

삽질로그

[JS] 배열 탐색 : forEach, filter, find

JHKim93 2023. 11. 29. 13:51

1. JS 배열 탐색 매서드

1. forEach : 배열의 각 요소들을 순회하면서 각 요소에 대해 콜백 함수를 실행한다.

2. filter : 배열의 각 요소들을 순회하면서 콜백함수의 조건에 대해 참인 값들로 새로운 배열을 반환한다.

3. find : 배열의 각 요소들을 순회하여 콜백함수의 조건에 대해 참인 첫번째 값을 반환한다.

2. 삽질 로그

  [{i: 'unique key', ...}, ... ] 이와 같은 배열에서 특정 key에 대한 동작을 수행해야 할 때, forEach를 사용해서 value의 i가 해당 key 값일 때를 찾는 식으로 많이 개발한다. 하지만 이 경우 전체 배열을 무조건 한 번씩 순회하기 때문에 불필요한 탐색 횟수가 발생하게 된다. 이 때, 값이 unique 하다면 find를 사용하여 먼저 배열에서 값을 찾고 해당 값에 대해 동작을 수행하는 방식으로 코드를 개선할 수 있다.

  forEach로 조건에 참인 경우 동작을 수행하는 것과 filter로 조건에 참인 배열을 생성 후 동작을 수행하는 것을 비교하면, filter를 썼을 때 배열을 반환함으로 메모리를 조금 더 소비하게 된다는 단점이 있지만 상대적으로 가독성이 더 낫다는 장점이 있다. 이 둘은 상황과 취향에 맞게 사용하면 될 듯 싶다.