Getting rid of frequent if statements

Hamdon Gunner
Sep 11 · 4 min read

In this article, I will be showing how I changed my messy code that had a lot of
“if statements” and long unwanted “switch cases”

When you start coding an idea for some kinda solution and because you just want to see if it’s gonna work — and fast. Your code might be a little bit stinky. most of the time, not a “little bit”.

It’s ok in the beginning, but you have to clean it up.

I am going to take a live example that got changed from a nasty code in the below image.

To the code in the below image.

The code is for a package that converts the Arabic names to English one Link


First of all, there was a lot of if statements that decided to sweep away.
We can do that by setting JSON object with all the cases that you want to check,

So let’s say we want to check if the first letter was “م” and the second letter is either “ح” or “خ” we can say.

if(firstLetter == "م" && secondLetter == "ح" || secondLetter == "خ")
return "u";

And it will be ok. But! What if we wanted to add more cases? It will look bad in one line, it will look bad in multi if statements lines.

AND THAT WILL LOOK SO BAD!

Don’t do that, please

The Solution is:

Well, my approach was creating an object that has the first letter as a key and the value is also an object the key of it will be the secondLetter and the value will be the return value

let obj = { k:
{ m: “a” }, { r: “b” }
};

Let me re-explain what’s happening here, so “k” is the first letter,
if the second letter after the “k” was “m” the return value will be “a”.
and if the second letter after the “k” was “r” the return should be “b”.

The table will make it even clearer. :)

But if you notice, till now we didn’t return or checked anything, so let’s do it.

The function has to check if the obj got a key equals the first letter. Then it will check if there is an object belongs to the obj[firstLetter] and has the key “secondLetter”. Then we have to return the value of the second object

if(obj[firstLetter] != undefined  && obj[firstLetter][secondLetter])
retuen obj[firstLetter][secondLetter]

But! there is even a better way to write it, right? what about the liner if.

res = obj[firstLetter] != undefined ? :
obj[firstLetter][secondLetter] ?
obj[firstLetter][secondLetter]
:""
:""

Now, in this case, we can add as many cases as we want and the code will stay organized as ever.

How to make it even better:

We can add another property to the object, like an action we want to use.

let obj = { k:
{ m: “a”, action: "slice" },
{ r: “b”, action: "" }
};

Also, if you created a router to the actions, it will be even more awesome.

AND NOW THE CODE IS ALL CLEAN !!!!

AND NOW THE CODE IS ALL CLEAN !!!!

You Can Check Old Code:

And The New Code!

Use this link to find the code https://github.com/hamdongunner/arabic-names-to-en

Ah, also, you may want to use one more trick, if you added a description above the functions like the one below. it will help explain, and clear what the function actually does whenever someone hovers it

/*** Some Letters depends on the coming next one to add some extra letters in between* @param {string} letter* @param {string} nextLetter* @example* checkNextLetter('م', 'ح') => 'muh'*/

Check it :)

After all that I believe that we all good to go with a much better, more understandable code.

See Ya!

JavaScript in Plain English

Learn the web's most important programming language.

Hamdon Gunner

Written by

More Than Coder, Editor at JavaScript in Plain English

JavaScript in Plain English

Learn the web's most important programming language.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade