JavaScript / every()로 배열 요소가 모두 조건에 맞는지 검사하기
Array.every()는 배열에서 콜백 조건을 만족하지 않는 요소를 찾으면 즉시 false를 반환하고 검사를 멈춥니다. 끝까지 모두 만족하면 true입니다. 단, 빈 배열도 true이므로 ‘값이 하나 이상 있고 모두 통과해야 한다’는 규칙에는 길이 검사도 필요합니다.
조건 함수와 조기 종료
items.every((value, index, array) => 조건) 형태로 사용합니다. 콜백은 현재 값과 인덱스, 원본 배열을 받으며, 각 값에 대해 참으로 해석되는 결과를 반환해야 합니다. 하나라도 거짓으로 해석되는 값을 반환하면 뒤쪽 요소는 검사하지 않습니다. 결과는 불리언이고 원본 배열은 every() 자체로 바뀌지 않습니다.
const scores = [10, 20, 3, 40];
const visited = [];
const passed = scores.every((score, index) => {
visited.push(index);
return score >= 5;
});
console.log(passed); // false
console.log(visited); // [0, 1, 2]: 인덱스 3은 검사하지 않음조건 함수에서 return을 빠뜨리면 반환값이 undefined가 되어 첫 검사에서 false로 끝날 수 있습니다. 반복문의 break를 별도로 작성할 필요는 없습니다. MDN의 Array.every() 문서에서 콜백 인수와 중단 규칙을 확인할 수 있습니다.
빈 배열과 비어 있는 슬롯
빈 배열에는 검사할 요소가 없으므로 [].every(...)는 true를 반환하고 콜백을 한 번도 호출하지 않습니다. 입력 데이터가 있어야 한다는 요구사항까지 every()만으로 확인할 수는 없습니다.
const scores = [];
console.log(scores.every(score => score >= 5)); // true
console.log(scores.length > 0 && scores.every(score => score >= 5)); // false
const sparse = [10, , 20];
console.log(sparse.every(score => score >= 5)); // true: 빈 슬롯은 건너뜀희소 배열의 빈 슬롯에서는 콜백이 실행되지 않습니다. undefined 값이 실제로 저장된 슬롯은 검사 대상이므로 결과가 달라질 수 있습니다. 모든 인덱스가 반드시 채워져야 한다면 배열 생성 단계에서 빈 슬롯이 없는지 따로 확인해야 합니다.
입력 검증에 사용할 때의 기준
사용자가 입력한 값이 숫자인지 먼저 확인한 다음 every()를 적용하세요. 입력을 숫자로 바꾸기 전에 Number("")가 0이 되는 점을 고려해 빈 항목도 검사해야 합니다. 단순히 모든 숫자가 기준 이상인지와, 입력이 최소 한 개 있는지의 두 조건을 분리하면 오류 메시지를 명확히 만들 수 있습니다.
function allAtLeast(values, minimum) {
return values.length > 0 && values.every(value => value >= minimum);
}
console.log(allAtLeast([7, 8], 5)); // true
console.log(allAtLeast([7, 3], 5)); // false
console.log(allAtLeast([], 5)); // false조건에 맞는 요소가 하나라도 있는지 묻는 경우에는 some()이 맞습니다. every()는 “모두”를 검사하고, some()은 “하나 이상”을 검사하므로 질문에 맞는 메서드를 선택하세요.
전체 예제: 검사한 위치까지 보기
아래 코드를 UTF-8로 array-every.html에 저장해 브라우저에서 엽니다. 숫자 목록과 최소값을 바꿔 ‘모두 검사’를 누르세요. 결과와 함께 실제로 방문한 인덱스가 표시됩니다. 빈 입력은 빈 배열로 처리하고, 쉼표가 연속되거나 숫자가 아닌 값은 오류로 표시합니다.
<!doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>배열 모든 값 검사</title>
</head>
<body>
<label for="numbers">숫자 목록 (쉼표로 구분, 빈 칸이면 빈 배열)</label>
<input id="numbers" type="text" value="10, 20, 3, 40">
<label for="minimum">최소값</label>
<input id="minimum" type="number" value="5">
<button id="check" type="button">모두 검사</button>
<pre id="output" aria-live="polite"></pre>
<script>
const numbers = document.querySelector('#numbers');
const minimum = document.querySelector('#minimum');
const output = document.querySelector('#output');
function check() {
const raw = numbers.value.trim();
const parts = raw === '' ? [] : raw.split(',').map(part => part.trim());
const values = parts.map(part => Number(part));
const limit = Number(minimum.value);
if (parts.some(part => part === '') ||
values.some(value => !Number.isFinite(value)) ||
minimum.value.trim() === '' || !Number.isFinite(limit)) {
output.textContent = '숫자를 쉼표로 구분해 입력하고 기준값을 확인하세요.';
return;
}
const visited = [];
const allPassed = values.every((value, index) => {
visited.push(index);
return value >= limit;
});
output.textContent = `배열: ${JSON.stringify(values)}\n` +
`every() 결과: ${allPassed}\n` +
`검사한 인덱스: ${visited.join(', ') || '(없음)'}\n` +
`입력된 값이 있고 모두 통과: ${values.length > 0 && allPassed}`;
}
document.querySelector('#check').addEventListener('click', check);
check();
</script>
</body>
</html>기본값 10, 20, 3, 40과 최소값 5에서는 결과가 false, 검사 인덱스가 0, 1, 2입니다. 최소값을 2로 바꾸면 네 값 모두 통과하여 true이고 인덱스 0, 1, 2, 3이 표시됩니다. 목록을 지우면 every() 자체는 true지만 ‘입력된 값이 있고 모두 통과’는 false로 구분됩니다.
