DEV Community

Adam Crockett 🌀
Adam Crockett 🌀

Posted on • Edited on

JavaScript, stuff you've never heard of (probably): labeled loops?

#javascript

I have been in the JavaScript scene for maybe 6 years and I love it when I find that I really ought to know about something fundamental especially something that isn't exactly bleeding edge.

You know this guy?

for (...) {}
Enter fullscreen mode Exit fullscreen mode

The for loop is a loyal companion that reminds me of my dog, it's always there when I need it, it's finite attention span and predictable loyalty is commendable. For convenience to distinguish my dog from other less firmiliar dogs, I gave my dog a name, so instead of shouting 'dog' and getting all the dogs coming to bring my slippers I just get my dog. Ace!

My goodness if only I could name my for loops then I could address them by name and give the commands to do tricks like break and continue and kill okay that last one is not so easy to teach a for loop or a dog to do.

lizie: for (let paws of dogs) {}
Enter fullscreen mode Exit fullscreen mode

Sooo, is that valid? ^^^

Yup,

What's it for?

A nested loop can break it's parent using the name break lizie or continue that works as well. But if you break Lizzie I will send you the bill.

I hope you are as shocked as I was.

Top comments (20)

Collapse
 
fraxken profile image
Thomas.G •

You can label a code block too !

myLabel: {
    const something = fn();
    if (something) {
        break myLabel;
    }

    // Do work here!
}
Collapse
 
adam_cyclones profile image
Adam Crockett 🌀 •

That's the spirit, take the wierd to the next level.

Does have the effect of early return without a function?

I think labels are just so out of place in js, cool as they are, they are not defined like variables and are more meta.

Saves writing an IFFE. Im certain this would be a touch faster then an IFFE (but it costs in reasoning about)

Collapse
 
rasata profile image
Rasata'Ninja • • Edited

wow,So I just discovered that label exists in JS!
It seems that this give you a thinner control on loop breaking ! an example here

Collapse
 
adam_cyclones profile image
Adam Crockett 🌀 • • Edited

Interesting I doubt a nested labeled code block would work, for fun reasons. Perhaps if it where encapsulated ()

Collapse
 
samthomson profile image
Sam Thomson •

Hey, nice post.
I can't think when I'd use this. Usually if there are exit conditions I use a while loop. When would I use a named for loop and not a while loop containing a for loop - or merged together like this:

for (let i = 0; i < ar.length && !extrenousCondition; i++) { }

Are named for loops just stylistic or?

Collapse
 
adam_cyclones profile image
Adam Crockett 🌀 • 
parent: for ( ... ) {
     child: for ( ... ) {
         if (exitConditionParent) break parent;
     }
}

You could do a labeled while loop as well.

I don't advocate or not advocate that anyone use this technique just that it's there and it's trivia.

Collapse
 
samthomson profile image
Sam Thomson •

Yeah I see. Interesting either way, thanks.

Thread Thread
 
adam_cyclones profile image
Adam Crockett 🌀 •

Your most welcome 😁

Collapse
 
dangoslen profile image
Dan Goslen •

mind = blown

Collapse
 
adam_cyclones profile image
Adam Crockett 🌀 •

Gooooood 👨‍🔬

Go checkout my oporater overloading posts for more wierdness.

Collapse
 
mjstelly profile image
Michael Stelly •

A foundational concept in software engineering is to translate business rules into code in the clearest, most maintainable way possible. I’ve developed mobile apps using JavaScript for over 10 years. Rarely have I ever revisited the same code after delivery, but I guarantee some else has. And there’s the rub.

Think of your typical day. You’re billing a hefty hourly rate. You’re new to a project and inherit a code base which makes extensive use of this feature. What’s the first thing you do apart from muttering expletives under your breath? You have to stop and ask someone or google it. Time that is usually not billable if it takes more than a few minutes.

My point isn’t to berate or cast aspersions. Quite the contrary. It’s to remind us that we as devs should choose clarity over cleverness whenever possible. Keep up the contributions.

Collapse
 
adam_cyclones profile image
Adam Crockett 🌀 • • Edited

There was no advocation of this technique from me, (it's a light hearted post) nor did you state if what you saw was good or bad, I don't know what you define as clever code, but as I have already stated elsewhere, clever code is a terrible idea, this post is designed to expose a strange syntax nothing more.

Collapse
 
konstantinklima profile image
Konstantin Klima •

Thanks for the tip!

I am usually the first one to criticise JS hack, but this one is pretty cool.
Great potential for Spaghetti code tho :D

Collapse
 
adam_cyclones profile image
Adam Crockett 🌀 •

That's absolutely why it's unheard of I believe the community pick and choose the features they want to see and further publicity is brought to that instead of this, probably because it MAY lead to spegetti, although without using this seriously I couldn't say.

Collapse
 
joemaffei profile image
Joe Maffei •

Typo: firmiliar -> familiar

Collapse
 
adam_cyclones profile image
Adam Crockett 🌀 • • Edited

Thanks, Dyslexia -> won't fix on purpose, because I keep track of how my spelling is improving naturally.

Also in the south west of England, anything goes. 😁

Collapse
 
mariewie profile image
MarieWie •

That's both weird and very nifty!

Collapse
 
adam_cyclones profile image
Adam Crockett 🌀 •

Glad you liked it, I think there is so much to JavaScript to learn and this is just one way to achieve this.

Collapse
 
adam_cyclones profile image
Adam Crockett 🌀 •

Good that you knew this, it sort of does doesn't it. I didn't say I like it it's just good to know that it's a thing. I want to do one on with statements as well.

 
adam_cyclones profile image
Adam Crockett 🌀 •

Your most welcome 😁

View full discussion (20 comments)