[Javascript API] every(), some() - 배열 메서드

Nayoung·2024년 11월 25일
0

Javascript API

목록 보기
3/7

1. 자바스크립트 배열 메서드 every() <-> some()

JavaScript의 every()some() 메서드는 배열 요소를 순회하며 특정 조건을 확인하는 메서드로, 불리언(boolean. 참 혹은 거짓) 값을 반환한다.

every() : 배열의 모든 요소가 제공된 함수로 구현된 테스트를 통과하는지 테스트하며, 하나라도 거짓 요소가 발견되면 즉시 false를 반환하고 배열 순회를 중지한다. 그렇지 않고 모든 요소에 대해 참 값을 반환하면, true를 반환한다.

some() : 배열 안의 요소 중 하나라도 주어진 판별 함수를 통과하는지 테스트하며, 하나라도 참 요소가 발견되면 즉시 true를 반환하고 배열 순회를 중지한다. 모든 요소가 하나라도 통과하지 못할 경우 false를 반환한다.

every() 메서드와 some() 메서드는 배열 요소를 순회하며 특정 조건을 확인해 불리언 값을 반환한다는 점에서 매우 비슷하지만, 배열 순회 중단 조건이 반대되어 두 메서드의 차이를 정확히 이해하고 있으면 때에 따라 더 효율적인 메서드를 선택해 작성하기 좋을 것이다.

이를테면,
배열의 요소 중 하나라도 거짓이 발견될 경우 즉시 순회를 중단하고 Error를 발생시켜야한다면 every() 메서드를,
배열의 요소 중 하나라도 참이 발견될 경우 즉시 순회를 중단하고 값을 변경시켜야할 경우 some() 메서드를 쓰는 것이다.

every()some() 둘다 사용하는 것 자체로는 원본 배열을 변경하지 않으나 콜백 함수 내부에서는 원본 배열에 영향을 미칠 수 있으므로 이 부분은 사용에 주의하는 것이 좋다.

이렇게 every()some()을 학습하기 전 헷갈리지 않도록 간단하게 둘의 차이를 확인해보았다.

1-1. every() 기본 문법

every() 메서드의 기본 문법은 다음과 같다.

const isTrue = array.every(callback(element, index, array), thisArg);

배열의 모든 요소가 주어진 조건을 만족하는지 확인한다. 조건을 모두 만족하면 true를 반환하며, 하나라도 만족하지 않으면 즉시 순회를 중단하고 false를 반환한다.

every() 메서드는 순서대로 콜백 함수, 콜백 함수에서 this로 사용할 값 이렇게 두 개의 인자를 받는다.
그리고 콜백 함수는 순서대로 (현재 요소, 현재 요소의 인덱스, 호출된 원본 배열) 을 인자로 받을 수 있다.

callback : 각 배열 요소에 대해 실행되는 함수 (필수)

  • element : 처리 중인 현재 요소
  • index : 처리 중인 현재 요소의 인덱스
  • array : 호출된 배열 자체

thisArg: callback 함수에서 this로 사용할 값 (선택 사항)

다시 강조하는 점은 이 메서드는 조건이 false인 요소를 만나면 즉시 중단하고 false를 반환하며, 이렇게 false인 요소를 만나기 전까진 기본적으로 모든 요소를 순회한다는 점이다. 참고로 빈 배열에서 호출하면 항상 true를 반환한다.

const numbers = [2, 4, 6];

// 모든 요소가 짝수인지 확인
const allEven = numbers.every(num => num % 2 === 0);
console.log(allEven); // true

// 조건을 만족하지 않는 요소가 하나라도 있으면 false
const allLessThanFive = numbers.every(num => num < 5);
console.log(allLessThanFive); // false

1-2. some() 기본 문법

some() 메서드의 기본 문법은 다음과 같다.

const isTrue = array.some(callback(element, index, array), thisArg);

배열의 하나라도 조건을 만족하는 요소가 있다면 즉시 순회를 중단하고 true를 반환하며, 배열의 모든 요소가 조건을 만족하지 못하면 false를 반환한다.

some() 메서드도 마찬가지로 콜백 함수, 콜백 함수에서 this로 사용할 값 이렇게 두 개의 인자를 받는다.
그리고 콜백 함수는 순서대로 (현재 요소, 현재 요소의 인덱스, 호출된 원본 배열)을 인자로 받을 수 있다.

callback: 각 배열 요소에 대해 실행되는 함수 (필수)

  • element : 처리 중인 현재 요소
  • index : 처리 중인 현재 요소의 인덱스
  • array : 호출된 배열 자체

thisArg: callback 함수에서 this로 사용할 값 (선택 사항)

some() 메서드의 중요한 특징은 조건을 만족하는 요소를 만나면 즉시 순회를 중단하고 true를 반환한다는 점이다.
참고로 빈 배열에서 호출하면 항상 false를 반환한다.

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

// 요소 중 하나라도 짝수인지 확인
const hasEven = numbers.some(num => num % 2 === 0);
console.log(hasEven); // false

// 요소 중 하나라도 5 이상인지 확인
const hasGreaterThanFive = numbers.some(num => num >= 5);
console.log(hasGreaterThanFive); // true

2. every() 와 some()의 활용 비교

제공 객체

const students = [
  { name: "Nayoung", score: 85 },
  { name: "Bob", score: 90 },
  { name: "Charlie", score: 70 },
];

문제 1 : 모든 학생이 80점 이상인지 확인

const allPass = students.every(student => student.score >= 80);
console.log(allPass); // false

문제 2 : 최소 한 명이라도 80점 이상인지 확인

const somePass = students.some(student => student.score >= 80);
console.log(somePass); // true

글 작성 참고 사이트:
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/every
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/some

profile
프론트엔드 개발자로 성장하고 싶은 그래픽 디자이너입니다!

0개의 댓글