DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’» is a community of 966,904 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

Create account Log in
Cover image for Code Smell 164 - Mixed Indentations
Maxi Contieri
Maxi Contieri

Posted on • Originally published at maximilianocontieri.com

Code Smell 164 - Mixed Indentations

Tabs vs Spaces. The most significant computer problem

TL;DR: Don't mix indentation styles

Problems

  • Readability

  • Code consistency

  • Standards violation

Solutions

  1. Choose one of them

  2. Stick to it

  3. Enforce it with code standards tests

  4. Share the rules on all the codebase

  5. Use an IDE like VS Code or WebStorm that doesn't include tabs at all.

Context

Whenever I publish an article many people don't care about the sample intent and rush to point at indentation mistakes.

Choosing one standard over the other will be a great solution.

Spaces always count as one.

Tabs can count as many different options.

Sample Code

Wrong

function add(x, y) {
// --->..return x + y;

      return x + y;
}

function main() {
// --->var x = 5,
// --->....y = 7;

    var x = 5,
        y = 7;
}
Enter fullscreen mode Exit fullscreen mode

Right

function add(x, y) {
// --->return x + y;
    return x + y;
}
Enter fullscreen mode Exit fullscreen mode

Detection

[X] Automatic

Any parser can enforce this rule.

Exceptions

Some languages like Python consider indent as part of the syntax.

In these languages, indentation is not accidental since it changes code semantics.

Tags

  • Code Standards

Conclusion

There's been so much debate on this subject.

The smell is related to mixing them, not about using one instead of another.

Some IDEs automatically convert one convention to the other one.

Relations

More Info

Disclaimer

Code Smells are just my opinion.


indentation joke

Whatever the device you use for getting your information out, it should be the same information.

Tim Berners-Lee


This article is part of the CodeSmell Series.

Top comments (0)

Classic DEV Post from 2020:

js visualized

πŸš€βš™οΈ JavaScript Visualized: the JavaScript Engine

As JavaScript devs, we usually don't have to deal with compilers ourselves. However, it's definitely good to know the basics of the JavaScript engine and see how it handles our human-friendly JS code, and turns it into something machines understand! πŸ₯³

Happy coding!