How to stop using If-else and make your code more readable

In my experience, using if-else statements is not a good practice. This makes the code less readable and developers are lazy to come up with better ways to make their code more readable.

I used TypeSript for several of the examples in this article. For those new to TypeSript, it is a superset of JavaScript, in other words it is also strongly typed JavaScript, hence the name TypeScript. You can still follow the examples in your preferred programming language. FYI, I chose TypeScript for this example because of its strongly typed syntax, so when we read the code we know what type is what.

According to me, there are main two use cases for if-else statements:

Value Solution

One of our use cases for if-else statements is when we're trying to resolve a value. For example, this example:

Disclaimer: It's better to use a switch statement, but to show how we can write better if-else statements, we'll do it using if-else statements

In this example, the code resolves the value of the "name" variable based on the current value of the "gender" variable. There is nothing wrong with coding this way. Technically, you will still be able to achieve the desired output, but there are better ways to rewrite this into much more readable code.

Now the code is clearer compared to the first code. We have now refactored the code to come up with a function called "getName". This function has the name parameter "gender". Look closely at what the function does. If the gender is "male", the function immediately returns "Robert". If the gender is "female", the function immediately returns "Margot". If the gender is neither "male" nor "female", the function returns an empty string. By writing it this way, we can now be able to read or understand a much better perspective of what the code is doing. It's also much easier to follow because we use the power of the return statement.

Performing validations/logic:

We use if-else statements when implementing validations. If we have complex validation, we can solve this by using else-if statements, right? No, we should try to look for alternatives first.

In this sequel, I created a function isGenderValid that takes the name of the gender parameter. This function returns a boolean value that we can use in our logic as an indicator of whether the gender is valid or not. In this implementation of the isGenderValid function, we can immediately see that if gender is false, our function immediately returns a boolean value of false. Then if the gender parameter is not equal to "male" and not equal to "female", we can also return false. Otherwise we can return true. We first coded all the criteria of the isGenderValid function where it returns false before finally returning true.

Compare these, when we try to use an if-else statement that is nested and does not use the power of the return statement. It's a bit readable right now, but imagine implementing it in a big way and reading hundreds if not thousands of lines of code with multiple nested if-else statements that only have one return statement. Unlike our first example, it's easy to get confused when a function returns a value or when a function completes its execution

Category: Website Development

Tags: Website Development Software Development Development Programming Optimization Code Cleaning Readability

Published at: September 16, 2022