미니옵빠의 code stubs
Array forEach / every / some break 사용하기 본문
자주하는 실수 중 하나.
Array.forEach() 는 break 문을 지원하지 않는데, return false 로 break 를 기대하는 경우가 있음
이 경우 try catch 로 break 시키거나 (코드 구림)
Array.every() / Array.some() 로 대체 사용하면 됨.
continue / break 를 섞어쓰려면 Array.some() 을 사용하는 것이 좋겠음
참고
There is no way to stop or break a forEach() loop other than by throwing an exception. If you need such behavior, the forEach() method is the wrong tool, use a plain loop instead. If you are testing the array elements for a predicate and need a Boolean return value, you can use every() or some() instead. If available, the new methods find() or findIndex() can be used for early termination upon true predicates as well.
각 문의 return false 동작을 확인해보자.
forEach
return true / false 둘 다 continue
forEach() 자체의 return은 undefined
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach#반환값
// Use return true
[1,2,3,4,5].forEach(function(value, index){
if (value==2) return true;
console.log(value);
})
> 1
> 3
> 4
> 5
< undefined
// Use return false
[1,2,3,4,5].forEach(function(value, index){
if (value==2) return false;
console.log(value);
})
> 1
> 3
> 4
> 5
< undefined
every
return true 는 continue / return false 는 break
every() 자체의 return은 모든 callball fn 의 반환값이 true 여야 true, 아니라면 false
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/every#반환값
// Use return true
[1,2,3,4,5].every(function(value, index){
if (value==2) return true;
console.log(value);
})
> 1
< false
// Use return false
[1,2,3,4,5].every(function(value, index){
if (value==2) return false;
console.log(value);
})
> 1
< false
some
return true 는 break / return false 는 continue
some() 자체의 return은 callball fn 에 의해 하나라도 return true 가 나오면 true, 아니라면 false. return true 하면 break 되면서 true 가 함께 반환되는데, 이 동작이 some()이라는 함수명과 잘 어울림
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/some#반환값
// Use return true
[1,2,3,4,5].some(function(value, index){
if (value==2) return true;
console.log(value);
})
> 1
< true
// Use return false
[1,2,3,4,5].some(function(value, index){
if (value==2) return false;
console.log(value);
})
> 1
> 3
> 4
> 5
< false
여담으로
jQuery.$each()
return true 는 continue / return false 는 break
http://api.jquery.com/JQuery.each/
자주 쓰는 사람이 아니라면 헷갈릴 수 밖에 없을 듯 -_-