"이 배열에 이런 게 있냐?"를 물어볼 때 쓰는 도구들 🔍
앞에서는 forEach, map, filter, reduce 같은 고차 함수로
배열을 "돌면서 가공하는" 패턴을 봤다.
이번 편은 살짝 역할이 다르다.
- "이 조건을 만족하는 게 하나라도 있냐?"
- "전부 다 이 조건을 만족하냐?"
- "이 조건을 만족하는 첫 번째 애가 누구냐?"
이런 질문에 답하는 조건 기반 탐색용 고차 함수 네 가지를 정리해본다.
- some
- every
- find
- findIndex
결론 먼저
- some: 하나라도 조건을 만족하면 true
- every: 모두 조건을 만족해야 true
- find: 조건을 만족하는 "첫 번째 요소"를 반환 (없으면 undefined)
- findIndex: 조건을 만족하는 "첫 번째 요소의 인덱스"를 반환 (없으면 -1)
공통점
- 전부 배열의 고차 함수다 (콜백 함수를 인자로 받는다)
- 내부에서 배열을 쭉 돌면서 조건을 검사한다
- 조건을 만족하는 순간 바로 멈추기도 한다 (끝까지 안 돌 수도 있음)
한눈에 비교
1. some - "하나라도 있냐?"
some은 배열에 조건을 만족하는 요소가 하나라도 있는지 확인할 때 쓴다.
const nums = [1, 2, 3, 4, 5];
const hasBiggerThanThree = nums.some(n => n > 3);
const hasNegative = nums.some(n => n < 0);
console.log(hasBiggerThanThree); // true
console.log(hasNegative); // false
콜백이 한 번이라도 true를 반환하면, 그 즉시
- some은 true를 반환하고
- 나머지 요소는 더 이상 검사하지 않는다
언제 some?
- 유저 목록 중에서 "탈퇴된 유저가 하나라도 있는지" 확인
- 권한 목록 중에서 "admin 권한이 하나라도 있는지" 확인
const users = [
{ id: 1, active: true },
{ id: 2, active: false },
{ id: 3, active: true },
];
const hasInactive = users.some(user => !user.active); // true
2. every - "전부 이래야 하냐?"
every는 배열의 요소가 모두 조건을 만족하는지 확인할 때 쓴다.
const nums = [1, 2, 3, 4, 5];
const allPositive = nums.every(n => n > 0);
const allEven = nums.every(n => n % 2 === 0);
console.log(allPositive); // true
console.log(allEven); // false
중간에 하나라도 조건을 만족하지 못하면 바로 false를 반환하고 멈춘다.
언제 every?
- 모든 입력 값이 유효한지 확인
- 장바구니 상품이 모두 재고가 있는지 확인
const items = [
{ id: 1, stock: 10 },
{ id: 2, stock: 3 },
{ id: 3, stock: 0 },
];
const allInStock = items.every(item => item.stock > 0);
// false (3번이 재고 0)
some과 every는 느낌상 이렇게 외우면 편하다
- some: "하나라도 그런 애 있어?" → OR 느낌
- every: "다 그렇게 해야 해" → AND 느낌
3. find - 첫 번째 요소 자체가 필요할 때
find는 조건을 만족하는 요소를 찾아서 그 값을 반환한다.
const nums = [1, 2, 3, 4, 5];
const firstBiggerThanThree = nums.find(n => n > 3);
const firstBiggerThanTen = nums.find(n => n > 10);
console.log(firstBiggerThanThree); // 4
console.log(firstBiggerThanTen); // undefined
- 조건을 만족하는 첫 번째 요소를 찾으면 즉시 반환
- 못 찾으면 undefined 반환
예시: 특정 id를 가진 유저 찾기
const users = [
{ id: 1, name: "Lee" },
{ id: 2, name: "Kim" },
{ id: 3, name: "Park" },
];
const user2 = users.find(user => user.id === 2);
console.log(user2);
// { id: 2, name: "Kim" }
filter와 비교
const over3Filter = nums.filter(n => n > 3);
// [4, 5]
const over3Find = nums.find(n => n > 3);
// 4
- filter: 조건을 만족하는 모든 요소를 배열로 반환
- find: 조건을 만족하는 "첫 번째 요소 하나"만 반환
조건을 만족하는 결과가 여러 개여도 첫 번째 것 하나만 필요하면 find가 맞다.
4. findIndex - 인덱스가 필요할 때
findIndex는 find의 인덱스 버전이다.
const nums = [1, 2, 3, 4, 5];
const idx = nums.findIndex(n => n > 3);
const notFoundIdx = nums.findIndex(n => n > 10);
console.log(idx); // 3
console.log(notFoundIdx); // -1
- 조건을 만족하는 첫 번째 요소의 인덱스를 반환
- 없으면 -1을 반환 (이건 indexOf와 동일 패턴)
예시: 배열에서 특정 id를 가진 유저 삭제하기
const users = [
{ id: 1, name: "Lee" },
{ id: 2, name: "Kim" },
{ id: 3, name: "Park" },
];
const targetIndex = users.findIndex(user => user.id === 2);
if (targetIndex !== -1) {
users.splice(targetIndex, 1);
}
console.log(users);
// [ { id: 1, ... }, { id: 3, ... } ]
filter vs some vs find 정리
이 세 개는 헷갈리기 쉬워서, 느낌만 잡고 가면 좋다.
const nums = [1, 2, 3, 4, 5];
- filter: "조건 만족하는 애들을 다 모아서 배열로 줘"
- nums.filter(n => n > 3) → [4, 5]
- some: "조건 만족하는 애가 하나라도 있는지만 알려줘"
- nums.some(n => n > 3) → true
- find: "조건 만족하는 첫 번째 애를 줘"
- nums.find(n => n > 3) → 4
한 줄로 요약하면
- 결과가 배열이면 → filter
- 결과가 boolean이면 → some / every
- 결과가 값 또는 인덱스면 → find / findIndex
includes와 some 차이
간단한 값 배열에서는 includes로도 충분할 때가 많다.
const nums = [1, 2, 3];
nums.includes(2); // true
nums.some(n => n === 2); // true
- 완전히 같은 값이 있는지만 보면 된다 → includes
- 조건이 조금이라도 복잡해진다 → some
예시: 객체 배열에서 특정 id가 있는지 확인
const users = [
{ id: 1, name: "Lee" },
{ id: 2, name: "Kim" },
];
// includes로는 안 됨 (객체 비교는 참조 비교)
// users.includes({ id: 1, name: "Lee" }) → 거의 항상 false
const hasId1 = users.some(user => user.id === 1);
// true
객체 배열에서 무언가를 체크할 때는 대부분 some/find 쪽이 정답이다.
실제 코드에서 어떻게 고르냐 (체크리스트)
실무 코드 기준으로, 대충 이렇게 선택하면 편하다.
- 조건을 만족하는 게 하나라도 있냐?
- 예: "비활성 유저가 하나라도 있냐", "재고 0인 상품이 하나라도 있냐"
- → some
- 다 이 조건을 만족해야 하냐?
- 예: "모든 입력 값이 유효하냐", "모든 상품이 재고가 있냐"
- → every
- 조건을 만족하는 첫 번째 요소가 필요하다
- 예: "id가 3인 유저를 찾아라"
- → find
- 조건을 만족하는 첫 번째 요소의 인덱스가 필요하다
- 예: "이 유저를 배열에서 삭제하고 싶다"
- → findIndex + splice 또는 슬라이스 조합
- 조건을 만족하는 모든 요소가 필요하다
- 예: "활성 유저만 따로 묶어라"
- → filter
오늘 내용 한 줄씩 다시 정리
- some: 하나라도 조건 만족 → true (OR 느낌)
- every: 모두 조건 만족해야 → true (AND 느낌)
- find: 조건 만족하는 첫 번째 요소를 반환
- findIndex: 조건 만족하는 첫 번째 요소의 인덱스를 반환
- 이 네 개는 전부 배열의 고차 함수이고,
"이 배열에 이런 조건을 만족하는 애가 있냐, 어디 있냐"를 물어볼 때 쓰는 도구들이다.
'FrontEnd > JavaScript' 카테고리의 다른 글
| JavaScript 배열 고차 함수 - forEach, map, filter, reduce (0) | 2025.12.10 |
|---|---|
| JavaScript 컬렉션 - Set (0) | 2025.12.10 |
| JavaScript 기본기 정리 – 반복문·배열·문자열·Math 한 장에 모으기 (0) | 2025.11.04 |
| JavaScript 컬렉션 - Array (0) | 2025.09.09 |
| JavaScript 컬렉션 - Map (0) | 2025.09.09 |