find, some 메서드로 배열 검사하기

로직을 작성하다 보면 배열 안에서 특정 조건을 만족하는 값을 찾아야 하는 때가 자주 있습니다.

배열을 순회하는 forEach 메서드를 활용해 배열에 5보다 큰 원소가 있는지 검사하는 코드를 작성해 보겠습니다. 

const array = [2, 4, 6, 8, 10];
const biggerThanFive = false;

array.forEach((el) => {
  if (el > 5) {
    biggerThanFive = true;
  }
});

console.log(biggerThanFive); // true

제대로 작동합니다!

다만, 이를 위해 변수를 따로 할당하고 3줄이 넘는 코드를 작성해야 한다는 것은 어딘가 찝찝합니다.

오늘은 특정 조건을 만족하는 값을 찾는 더 나은 방법을 소개하겠습니다.

Array.prototype.find

첫 번째 방법은 find 메서드입니다.

Array.prototype.find(callback(currentElement, index))

find 메서드는 특정 조건을 만족하는 값이 존재하면 그 값을 리턴하는 함수인데요, 한번 find를 활용해 5보다 큰 값이 있는지 찾아봅시다.

const array = [2, 4, 6, 8, 10];

console.log(array.find((el) => el > 5)); // 6

익명 함수를 활용해 단 한 줄로 5보다 큰 첫 번째 원소, 6을 찾아 리턴한 모습입니다.

 

find 메서드는 함수를 인자로 받고 함수 본체의 조건을 만족하는 첫 번째 원소의 값 을 리턴하는데요, 사용 빈도가 비교적 적긴 하지만 findIndex 함수를 사용하면 조건을 만족하는 첫 번째 원소의 인덱스를 얻을 수도 있습니다.

const array = [2, 4, 6, 8, 10];

console.log(array.findIndex((el) => el > 5)); // 2 (배열 내 6의 인덱스)

Array.prototype.some

다음은 some 메서드를 사용하는 방법입니다.

Array.prototype.some(callback(currentElement, index))

find와 findIndex는 조건을 만족하는 값과 인덱스를 리턴했다면, some 메서드는 조건을 만족하는지에 대한 참/거짓 여부를 리턴합니다.

 

이번에도 배열에 5보다 큰 원소가 있는지 찾아봅시다.

const array = [2, 4, 6, 8, 10];

console.log(array.some((el) => el > 5)); // true

네! 역시나 단 한 줄 만으로 조건을 만족하는지 검사할 수 있었습니다.

이처럼 자바스크립트에는 정말 사기적인 편리한 배열 메서드가 존재하는데요, 이런 도구들을 잘 활용하면 작업을 간소화할 수 있습니다!

 

그럼, 즐코하세요~ 😁

TL;DR

- 배열 내 특정 조건을 만족하는 값 찾기 - Array.prototype.find

- 배열 내 특정 조건을 만족하는 값의 인덱스 찾기 - Array.prototype.findIndex

- 배열 내 특정 조건을 만족하는지 찾기 - Array.prototype.some