Front/JavaScript

[Javascript] Array.prototype.every( ) - 배열의 반복메서드 : break 문 활용하고 싶다?

헹창 2021. 2. 9.
반응형

[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로 반환한다.

 

 

 

728x90
반응형

댓글

추천 글