So, to make code more readable and easier to understand do you keep an extra space between lines like this :
const a = getA();
a.doStuff();
a.doAnotherStuff();
Or, there is no extra space between lines :
const a = getA();
a.doStuff();
a.doAnotherStuff();
Which one do you prefer?
I refer you to this wiki link, which outlines the differences between indent styling. I will also say that there is no correct or wrong way to do this. It just depends what you like and what the style guidelines are of your team/company/project.
For me, programming is like writing an article. There are logical blocks which belong together because they describe a common thing. In between there should be blank lines.
In addition, I come languages, which usually put an opening curly bracket in a new line, so I am used to there being space. It improves overview greatly that way, but I do use some exceptions to that rule. That's why I write code, like:
/* CSS */
.c-my-component {
background-color: hsl(0, 50%, 80%);
}
.c-my-other__component {
color: hsl(0, 0%, 3%);
}
// JS
'use strict';
const path = require('path');
const fs = require('fs');
const nml = require('node-mod-load');
const defer = require('promise-defer');
const myMod = require('./myMod');
const conf = require('../config/myConf');
const foo = function () {
console.log('foo');
};
const bar = function () {
var i = 0;
const l = 10;
while (i < l) {
const str = `bar ${i}! <3`;
console.log(str);
i++;
}
};
foo();
bar();
I use spaces between method declarations, but inside the method I try to keep it as simple as possible, doing one thing and in the right level of abstraction. So, generally, I don't use spaces.
I rarely use line breaks, except for in between different sections of code (e.g. functions)
I use very few line breaks in my code, and for me keeping this vertical rhythm helps me:
Because of this, the line breaks I do use have a purpose. When writing HTML I keep modules or blocks of tags together, and I'll insert a single line break between sections to visually delineate where these blocks are.
<!DOCTYPE html>
<meta charset=utf-8>
<title>Example HTML Page</title>
<h1>Example Headline</h1>
<h2>Example Subhead</h2>
<p>Text</p>
<p>text</p>
<p>text</p>
<footer>© 2016 Company Name</footer>
When writing CSS I don't add extra line breaks between properties, or rules, though I do put a line break around @media queries, just to help see where they start. In CSS is where adding extra line breaks severely slows down reading time, and another thing - every rule begins at the left edge of the current indentation block (styles in queries are indented once). I've worked with CSS where child elements are indented underneath parent elements (not in SASS, in actual CSS) and that's the worst for being able to re-read and spot errors. Here's what a bit of CSS might look like formatted nicely:
* {
box-sizing: border-box;
}
body {
margin: 0;
}
html {
font-size: 12pt;
font-family: sans-serif;
}
@media (min-width: 500px){
body {
background: lime;
}
}
@media (min-width: 900px){
body {
background: red;
}
}
And lastly, in JavaScript I will often put an extra line break between variable declarations and the commands that follow, and may separate blocks of code or functions to group similar things together. Here's an example of JavaScript with line breaks where I feel they are most necessary:
var tag = document.querySelector('[data-plugin]')
for (i in tag){
tag[i].setAttribute('data-plugin',i)
}
function example(){
alert(tag.length)
}
document.addEventListener('click',example)
I hope that helps demonstrate how conservative use of line breaks can boost legibility and help make code more readable. Adding too many extra line breaks is often worse than including not enough line breaks for being able to read and digest code, so if anything I would lean on the side of using fewer line breaks once you're familiar with the language you're writing.
When you're learning, take as much space as you need to get the job done, and format you code nicely later (if it matters to you).
I prefer to group things that have something to do with each other. But I do not like to stick everything together, makes code ugly and hard to read.
I prefer not to add spaces between lines when I'm writing a function, But in any other case, I do prefer the spaces, It's cleaner. :)
Maximilian Berkmann
Web and programming
I use both, I generally space the different components of a code to make it clear to the reader/coder that the chunks of snippets/codes are for a particular usage and I don't use spaces between lines within a chunk.