DEV Community

How should we indent `const` declarations?

Ken Bellows on January 10, 2019

I'm a huge fan of the additions to JavaScript of let and const to declare block-scoped variables. In particular, I love const for the clarity of in...

Read full post

Frank Puffer • Jan 10 '19

I definitely prefer

const foo = 10;
const bar = 20;
const baz = 30;

not only for const but also for var and let.

It makes refactoring easier because each declaration is completely independent from the other ones. Just remove a line to remove a variable. You don't even need to change a comma to a semicolon.

Another advantage: Most search tools only show the line where the search string occurs. If you search for all occurences of bar in your editor, you might prefer to see

const bar = 20;

instead of

    bar = 20,

as a result because it provides more information.

I don't believe that typing a few more keywords will slow down your coding significantly.

Ken Bellows • Jan 10 '19

Clearer search results is an interesting point I hadn't heard before. 🤔 Nice one, I'll have to think on that

Ken Bellows • Jan 11 '19

So do you do the same with let and (if you still use it) var?

Yeah, that was my thought in the last paragraph of my post, they must already have an approach figured out since they use less indentation that the width of var or let. I'm curious to hear form an avid 2-spacer and see how they feel about it.

Michael • Jan 12 '19

I mean, we're talking about variables but this sounds like a problem with formatting code in general. I've come across this dilemma with just writing comments:

let id = 'value'; // Important Value
let element = 'elementNode'; // Important Element

Inline comments are always broken by line length. I've concluded after much time wasted, it's waste of time. I think consistency is more important, so if you are following a styleguide, or the rest of your identifiers are indented with a certain indent, just use that, even if it breaks it you can scan the code more easily looking for the same indent level, even if it doesn't match perfectly; noticing different indent levels just messes with that flow.

Julien Barbay • Jan 11 '19

6 spaces for me. Your 6 spaces example is broken to me, as for a multiline variable declaration block i would add an extra \n after it.

Frank Puffer • Jan 11 '19

But why? As soon as you run any code formatter over it, it will change indentation. Or do you know any code formatter that makes a difference between var and const?

Also, when working together with other developers, you should typically adhere to coding guidelines. Often these coding guidelines are enforced meaning that you won't be able to check in your code if they are not met. I have not heard of coding guidelines with such complicated indentation rules.

Ken Bellows • Jan 11 '19

I take your point regarding current practicality, but I think we should leave aside current patterns and tooling for this discussion. The point of this article is to question. what beat practices should be in the first place. Formatters and standards can always be updated if accepted best practices change.

Frank Puffer • Jan 11 '19

Good point - we should never stop thinking about how we could improve the current state.

Jen Chan • Jan 11 '19

Uhh wait. There ARE const indentations...?

Michael • Jan 12 '19 • Edited

No, he just meant as a practice, indenting a block of identifiers. Rather than declaring identifiers one line at a time, you can delimit them with commas to share a single statement.

let a = '1', b = '2';

So you indent them on a new line to indicate they share the same keyword but are still related.

let a = '1',
    b = '2';

Ken Bellows • Jan 12 '19

What do you mean?