자바스크립트 filter(), some(), find() 특징 및 차이점

자바스크립트에서 filter()는 배열에서 조건을 만족하는 요소만 "걸러내는(filter)" 메서드

✅ 기본 개념

let 결과배열 = 원본배열.filter(조건을판단하는함수);

• filter()는 배열의 각 요소를 순회하면서, 조건이 true인 값만 모아서 새 배열을 만들어 반환 !
• 원본 배열은 변하지 않음

✅ 간단한 예시

const numbers = [1, 2, 3, 4, 5, 6];

const evenNumbers = numbers.filter(n => n % 2 === 0);

console.log(evenNumbers); // [2, 4, 6]

• n % 2 === 0 → 짝수인지 검사
• filter()는 true인 값들만 골라서 [2, 4, 6] 새 배열을 리턴함

✅ 객체 배열 예시 

const users = [
  { name: "지민", age: 24 },
  { name: "수빈", age: 30 },
  { name: "예진", age: 19 }
];

const adults = users.filter(user => user.age >= 20);

console.log(adults);
// 결과:
// [
//   { name: "지민", age: 24 },
//   { name: "수빈", age: 30 }
// ]

✅ 핵심 특징 요약

항목	내용
반환값	새 배열
원본 배열 변경 여부	❌ 변하지 않음
콜백 함수 반환값	true면 포함, false면 제외
대표 용도	검색, 조건 필터링, 리스트 정제 등

 

✅ Genesys 코드에도 적용 가능 예시

예를 들어, participants 배열 중 customer인 사람만 뽑고 싶다면?

let customers = participants.filter(p => p.purpose === "customer");

 

---

✅ filter()랑 some()의 차이점 

filter()랑 some()은 둘 다 배열을 검사하는 메서드지만,
목적과 반환값이 완전히 달라.

 

✅ 핵심 차이 요약

항목	filter()	some()
하는 일	조건을 만족하는 요소들을 모아서 새 배열 반환	조건을 만족하는 요소가 하나라도 있으면 true 반환
반환 타입	배열 ([])	불린값 (true 또는 false)
사용 목적	조건에 맞는 요소들을 추출하고 싶을 때	조건에 맞는 요소가 있는지 여부만 확인할 때

 

✅ 예제로 비교

🔹 공통 배열

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

🔸 filter()

const evens = numbers.filter(n => n % 2 === 0);
console.log(evens); // [2, 4]

• 짝수만 걸러서 새 배열을 반환

🔸 some()

const hasEven = numbers.some(n => n % 2 === 0);
console.log(hasEven); // true

• 짝수가 하나라도 있으면 true

✅ 실무 예시

🧑‍💻 상황: 로그인한 사용자가 "admin" 역할인지 확인

const users = [
  { name: "유정", role: "user" },
  { name: "지훈", role: "admin" },
  { name: "민지", role: "user" }
];

🔹 some()으로 "admin"이 있는지?

const isAdminExist = users.some(user => user.role === "admin");
console.log(isAdminExist); // true

🔹 filter()로 "admin"인 사람 목록 얻기

const adminUsers = users.filter(user => user.role === "admin");
console.log(adminUsers);
// [{ name: "지훈", role: "admin" }]

✅ 언제 뭘 써야 할까?

상황 추천	메서드
조건 만족하는 요소를 모아야 할 때	filter()
조건 만족하는 요소가 있는지만 확인할 때	some()
if문 안에서 true/false만 필요할 때	some()
출력/반복할 새 배열이 필요할 때	filter()

 

---

find()는 some()이나 filter()랑 비슷하지만, 딱 하나만 찾고 멈춤 조건에 맞는 "첫 번째 요소"를 반환하는 메서드 !

✅ 기본 문법

const result = array.find(callback);

• 배열에서 조건을 만족하는 첫 번째 요소만 반환
• 조건에 맞는 요소가 없으면 undefined 반환
• filter는 배열 전체, find는 요소 하나!

---

✅ 예제

const users = [
  { name: "유정", role: "user" },
  { name: "지훈", role: "admin" },
  { name: "민지", role: "admin" }
];

const firstAdmin = users.find(user => user.role === "admin");

console.log(firstAdmin);
// { name: "지훈", role: "admin" } ✅ 조건에 맞는 첫 번째 admin

---

✅ filter()와 비교

const allAdmins = users.filter(user => user.role === "admin");
console.log(allAdmins);
// [
//   { name: "지훈", role: "admin" },
//   { name: "민지", role: "admin" }
// ]

---

✅ find() vs filter() vs some() 차이

메서드반환값목적

find()	조건 만족하는 첫 요소 (객체 하나)	조건에 맞는 1개만 찾고 싶을 때
filter()	조건 만족하는 모든 요소 배열	조건에 맞는 여러 개 추출할 때
some()	true/false	조건 만족하는 요소가 존재하는지만 확인

 

---

✅ 예제 상황 비교

const numbers = [1, 3, 5, 7, 8, 9];

const firstEven = numbers.find(n => n % 2 === 0);  // 8
const allEvens = numbers.filter(n => n % 2 === 0); // [8]
const hasEven = numbers.some(n => n % 2 === 0);    // true

---

✅ 언제 find()를 쓰면 좋을까?

• 고객 정보 중 ID가 1인 사람 찾기
• 전화 통화 중 특정 상태인 participant 한 명 찾기
• 단 하나의 조건만 만족하면 되는 경우 (예: 첫 로그인 유저)