DEV Community

Replace your switch statement and multiple "if and else", using Object Literals - [en-US].

Tauan Camargo on November 27, 2019

So First, What is Switch Statement? A switch is a function that receives data, and that data will be analyzed, if this data is equal t...

Read full post

Petar Kolev • Nov 28 '19

From syntactic point of view ternary is way more terrible to read instead of switch :d

deathshadow60 • Nov 27 '19

Most of your arguments against SWITCH are in fact it's features. It's like the derpy linters that throw a hissy-fit if you drop-through, one of the entire reasons to use switch in the first place. Oh noes, you have to say break, return, or continue, notz thatz. :/

Though I'm often dismayed how often I see break; after a return; (hurr-durrz) or how many people don't realize continue can also be used there.

From an efficiency standpoint, your claims of disadvantages of switch are more myth than fact. JavaScript table lookups are still going to do comparisons, you are manually coding such a comparison so if anything is going to be slower in execution, it's probably your (Users[type] || Users.default) given how piss poor the performance of JS object indexes are. JUST like the painfully bad performance of JS' ALLEGED arrays. (that are in fact pointered lists).

That said, it's often better to use the object approach you mention for code clarity or organization sake, it's an obvious answer in a lot of situations, but comparing it to IF or SWITCH? Yeah, no.

Tauan Camargo • Nov 27 '19

Thanks for ur review.. i wrote this article to pass, what i'm leraning .. how i said "//I'm not dictating the rule - it's just another way of solving our everyday problems" ... i don't have 40 years in programming .. u have more arguments then me , i know it .. i was trying to share something cool .. that i learned .. i'm sorry about that :D

Seanmclem • Nov 28 '19

I like your approach better, and agree with your logic for using it. keep it up

Tauan Camargo • Nov 28 '19

Thanks man ... let's keep sharing knowledge...

Nikita Hlopov • Nov 28 '19

Nice article and interesting approach. Thanks!
I have a question however. Why would you use methods to return the string instead of assigning this string to a property like so:

const Users = {
  admin: 'This User is Admin!',
  client: 'This User is Client!',
  salesman: 'This User is Salesman!',
  default: 'This User is MasterUser'
}

I mean wouldn't it be more clean and straightforward way?

Tauan Camargo • Nov 28 '19

Hey man ... thanks .. so in the project that i'm current working i used methods to change the data and other things ... it was just a mistake hehehe i'm sorry .. your approach is absolutelly correct... thanks for your review i'm going to edit it ..

Andrey Kolybelnikov • May 11 '20

I was about to comment with the same when I saw this has already been suggested :)
One more cool little enhancement will allow you to adhere to immutability principle (that is if you'd like to prevent anyone from changing your object properties somewhere in the code later):

Object.freeze(Users)

From now on your object literal is readonly.

Tauan Camargo • May 11 '20

hey man thanks for the comment :D

Sung M. Kim • Nov 27 '19

Thanks for sharing the post in both English & Brazilian Portuguese (pr-BR).

For those who want to read pr-BR version, check out this post.

Substitua sua instrução switch e vários "if and else", usando Object Literals - [pt-BR].

Tauan Tathiell ・ Nov 27 ・ 3 min read

#javascript #react #programming

Tauan Camargo • Nov 27 '19 • Edited

Thanks man... I'm going to do that for all my articles .. i'm trying to share to our community, everything i'm learning :D

Sung M. Kim • Nov 28 '19

You're welcome and I appreciate sharing your knowledge/experience :)

Tauan Camargo • Nov 27 '19

Thanks man .. i liked a lot your approach...
// I'm not dictating the rule - it's just another way of solving our everyday problems. hehehehe

Petar Kolev • Nov 28 '19

Yes, I do because in my work’s project we have many ternary operators used and when they are long it’s brain damaging while reading them. Again - just from synthetic point of view :)

Tauan Camargo • Nov 27 '19

thanks for ur review, i put this default user just to show a sample how to use. but i understand ur point .. i'll change some code's soon... one more time Thanks xD

Juan Carlos • Nov 28 '19

I think this should be benchmarked to prove that this construct is better than the switch,
my guess is it is not.

Tauan Camargo • Nov 28 '19 • Edited

I take this printscreen by benchmark test ...

Tom Bonanno • Nov 28 '19

Very cool. Thanks for sharing. One issue I can see that you should be aware of is that you won't get an accurate code coverage result for testing, as it will not be seen as branches.

Tauan Camargo • Nov 28 '19

Thanks for your review man .. i'll update this article or create another to update with new things

Petar Kolev • Nov 28 '19

This will be pretty neat if you have super long switch in React reducer for instance =] Thanks for the article! It’s nice to know another way of doing things!

Tauan Camargo • Nov 28 '19

Yes man .. i like this approach .. i dont guess this will solve all my problems but is a cool approach... thanks for your review

Prasanna Kulkarni • Nov 28 '19

I liked the way you explained. Will use object literals in my future projects.

Tauan Camargo • Nov 28 '19

Hey man appreciate that.. thanks a lot