How to break ForEach Loop in TypeScript
JavascriptAngularTypescriptForeachBreakJavascript Problem Overview
I have a the below code, on which i am unable to break the loop on certain conditions.
isVoteTally(): boolean {
let count = false;
this.tab.committee.ratings.forEach(element => {
const _fo = this.isEmptyOrNull(element.ratings.finalOutcome.finaloutlook);
const _foreign = this.isEmptyOrNull(element.ratings.finalOutcome.foreign);
const _local = this.isEmptyOrNull(element.ratings.finalOutcome.local);
const _tally = element.ratings.finalOutcome.voteTally.maj + element.ratings.finalOutcome.voteTally.dis;
if (_fo == false && _foreign == false && _local == false) {
if (_tally > 0) {
**return count = false;**
}
} else {
if (_tally < 0) {
**return count = false;**
}
}
});
return count;
}
On the star-marked area, i want to break the code and return the boolean value, but i am unable to do it right now. Can anybody help me.
Thanks in advance.
Javascript Solutions
Solution 1 - Javascript
this.tab.committee.ratings.forEach is not an operator.
Typescript allows for much more readable code.
Use a for loop in style as follows:
for (let a of this.tab.committee.ratings) {
if (something_wrong) break;
}
p.s. forget "coding as with jQuery" in Angular. It just doesn't work.
Solution 2 - Javascript
It is not possible to break from forEach() normally.
Alternatively you can use Array.every() because you wish to return false while breaking the loop.
If you want to return true, then you can use Array.some()
this.tab.committee.ratings.every(element => {
const _fo = this.isEmptyOrNull(element.ratings.finalOutcome.finaloutlook);
const _foreign = this.isEmptyOrNull(element.ratings.finalOutcome.foreign);
const _local = this.isEmptyOrNull(element.ratings.finalOutcome.local);
const _tally = element.ratings.finalOutcome.voteTally.maj + element.ratings.finalOutcome.voteTally.dis;
if (_fo == false && _foreign == false && _local == false) {
if (_tally > 0) {
**return count = false;**
}
} else {
if (_tally < 0) {
**return count = false;**
}
}
});
Solution 3 - Javascript
You cannot ‘break’, it won’t even run because the break instruction is not technically in a loop. Solution? Just use a normal for loop. Nobody would laugh at you.
Solution 4 - Javascript
I think even better solution is to use for. With for you can return a value when it's found and break the loop. It's a lot cleaner solution
for (element of this.tab.committee.ratings) {
// and here you use your element, when you return a values it stops the cycle
if (element === something){
return element;
}
}
Solution 5 - Javascript
const blocks = document.querySelectorAll('.block');
var breakMe = false;
blocks.forEach((block, i) => {
if(breakMe == false) {
/*code that you want*/
if(i < 2) {
block.style.background = 'red';
} else if(i != 4) {
block.style.background = 'blue';
} else if(i == 4) {
breakMe = true;
/*change breackMe to true if you want to breack forEach*/
}
}
})
<!DOCTYPE html>
<html lang="en">
<body>
<div id="container">
<div class="block" style="width: 200px; height: 200px; background: purple; margin: 50px"></div>
<div class="block" style="width: 200px; height: 200px; background: purple; margin: 50px"></div>
<div class="block" style="width: 200px; height: 200px; background: purple; margin: 50px"></div>
<div class="block" style="width: 200px; height: 200px; background: purple; margin: 50px"></div>
<div class="block" style="width: 200px; height: 200px; background: purple; margin: 50px"></div>
</div>
</body>
</html>
Solution 6 - Javascript
simply do return false;. It will break.