Development Principle 2 : How to keep coding layout and style clean?

There are many names for badly written code, but regardless of what you call it; it’s not hard to notice. Whether it has no layout in style, doesn’t utilize indentation, has long line lengths, or cobbles together tabs and spaces with no rhyme or reason; all of these things can make code difficult to read, and even more difficult to utilize and edit appropriately. Ideally, you should be writing code that is easy to read by other software developers, so they are able to quickly determine what is occurring in your program. Clean code leads to easier collaboration between developers, enhanced productivity, and a simpler, less cluttered debugging process. If you’re looking to keep your code clean, legible, and efficient; then you can utilize some of the tips we’ll be mentioning below.

Keep Things Clean

There are multiple ways to keep your code looking fresh and clean. One of the ways you can do this is by keeping the variables that you declare outside of the logic processes of your code. For example, when you include your variable declarations inside your logic, it looks like this:

function foo() {

int x;

int y;

if (...) {

y = ...;

}

int z;

if (...) {

z = ...;

}

return x * y * z;

}

A bit clunky, far too many lines are used, and you don’t exactly get a clear function of the code’s intended function. In comparison, this is what it looks like when you declare your variable outside of your code’s logic:

function foo() {

int x, y, z;

if (...) {

y = ...;

}

if (...) {

z = ...;

}

return x * y * z;

}

For most scenarios, you’ll find it best to declare your variables at the top of your code’s functions. Additionally, you should also include your statements at the top of your code organization. Doing so makes your code easier to scan, and keeps things concise. Another way to keep your coding clean is to keep your functions both short and in logical order. Part of this means when naming or creating your functions, you should name it as a descriptor for what the function accomplishes. So, instead of naming a function something like: 

function gcoli(x) {

return color[x];

}

You could instead name your function: 

function getColorByIndex(inputNum) {

return color[inputNum];

}

Look at our above function: As you can tell, the name is a bit lengthier, but both the functions’ declaration and use give you a clear idea of what’s happening within the code at only a quick glance. Additionally, these function names are easier to organize, which again adds to the scannability of code. You should also use whitespace in your code to your benefit, many coding style guides use white space to break up code into more manageable, readable chunks.

For example, without whitespace; your code may look something like this: 

$().doSomething(function(){

// do stuff here

},‘parameter’,2,3,2);

$().doSomethingElse(function(){

// do other stuff here

},‘parameter’);

Pretty messy, isn’t it? Now let’s see what the same code looks like with the usage of whitespace:

$().doSomething( function() {

// do stuff here

}, ‘parameter’, 2, 3, 2);

$().doSomethingElse( function() {

// do other stuff here

}, ‘parameter’);

Code Legibility is Also Critical

In order to make your code simple to read, the usage of indentation is good for showing where specific blocks of code start and end. Depending on the language or framework, there will be different style guides that will inform you of how much space or indentation should be utilized for that specific language. Paying attention to the width of your lines of code is also important, especially when utilizing older systems which often only have a character width of 80 maximum. However, modern machines are capable of fitting upwards of 300 characters per line. The often middle-ground line length for modern coders will typically fall somewhere between 100 to 150 characters. 

Be Consistent, Be Uniform

Regardless of the indentation style, whitespace method, or guide you choose for your project, it’s important to not vary from this style once you’ve chosen it. Keeping your project consistent and uniform in its layout and style makes your code more easily produced, upgraded, maintained, and supported throughout its lifecycle.