Refactoring if statements for readability

How can you make this if statement more readable?

if (currentUser !== null) {
    displayUserName();
}

The condition inside an if statement can often be moved out of the if statement and into a separate variable:

var isLoggedIn = currentUser !== null;
if (isLoggedIn) {
    displayUserName();
}

Introducing this variable adds new information to our code. It's now clear that the if statement checks whether the user is logged in.

Alternatively, you could write a function that can be re-used across your application:

function isLoggedIn () {
    return currentUser !== null;
}

if (isLoggedIn()) {
    displayUserName();
}

Creating this new function serves the same purpose of introducing a new meaningful to make your code easier to understand.

This pattern can not only be used for comparisons inside the if statement, but also complex combinations of conditions with && or ||.

Make sure that the variable you introduce actually adds new information. hasMoreThanTenBooks doesn't give me more information than books.length > 10. However, isEligibleForBookClub clearly shows what we actually care about.

Menu