[Javascript] Array.prototype.every( ) - 배열의 반복메서드 : break문 활용하고 싶다?
자바스크립트 배열에서 제공하는 반복 메서드 forEach, some, every - every를 한 번 살펴보자.
보통 반복문을 사용할 때는 forEach를 사용하는데, 원하는 요소를 찾은 뒤 더 이상 for문을 돌고 싶지 않은 경우 break문 을 사용하려 해 본 적이 있을 것이다.
forEach 에서는 break 를 제공하지 않을 뿐더러
break 문과 같은 코드를 구현하려면 try - catch를 사용하는 등 코드의 길이도 구조도 복잡해진다.
이 때 사용하기 좋은 every 메서드를 살펴보자
Array.prototype.every()
callback 함수가 false를 반환하는 요소를 찾을 때까지 배열에 있는 각 요소에 대해 한 번씩 callback 함수를 실행
해당하는 요소 발견할 경우 every는 즉시 false를 반환, 모든 값에서 true를 반환하면 true 반환
참고 : 빈 배열에서 호출하면 무조건 true 반환
구문
array.every(callback [, thisArg] )
- callback의 매개변수
① value : 처리할 현재 요소
② index : 처리할 현재 요소의 인덱스 [Optional]
③ array : every를 호출한 배열 [Optional]
- thisArg : callback 실행 시 this로 사용하는 값 [Optional]
예제
이해하기 쉽게 forEach 문과 비교하여 예제를 살펴보자
- forEach
[12, 5, 8, 139, -1].forEach(function(value, index, array){
if(value < 10) {
console.log(value, "작다");
return true;
} else {
console.log(value, "크다");
return false;
}
});
▶ 결과 값
12 "크다"
5 "작다"
8 "작다"
139 "크다"
-1 "작다"
undefined // forEach 함수의 반환값
- every
[12, 5, 8, 139, -1].every(function(value, index, array){
if(value < 10) {
console.log(value, "작다");
return true;
} else {
console.log(value, "크다");
return false;
}
});
▶ 결과 값
12 "크다"
false // every 함수의 반환값
차이가 눈에 보이나요?
forEach는 조건에 해당하는 값이 있어도 배열의 크기만큼 반복을 하는 반면,
every는 조건에 해당하는 값이 있으면 그 뒤에 배열의 값이 존재하더라도 반복문을 멈추고, false로 반환한다.
'Front > JavaScript' 카테고리의 다른 글
[Javascript] iframe 하위 객체 접근 방법 (0) | 2021.04.30 |
---|---|
[꿀정보] JavaScript (JS) 소스코드 들여쓰기 쉽게 정리하기 (1) | 2021.02.26 |
[Javascript + CSS3] 화면 스크롤 내릴 때, 이미지 객체 FadeIn 효과 표출 간단하게 구현하기 (2) | 2020.10.26 |
[Javascript] 순수 자바스크립트 영역 캡쳐 후 이미지로 저장하기 (0) | 2020.09.02 |
[JavaScript] 자바스크립트 변수(var/let/const) 선언 방식의 차이 (1) | 2020.08.12 |
댓글