JavaScript Simple Code Structure

Subscribe to my newsletter and never miss my upcoming articles

Listen to this article


Statements

Statements generally are instructions to be executed by a computer program.

A JavaScript program or code is a list of programming statements

Statements in computer programming are executed from top to bottom (and left to right) in the order they appear.

console.log('Hello World!')

When there is more than one statement in a JavaScript program, it is recommended to end each statement with a semicolon.

console.log('Good Day!');
console.log('Happy Coding!');

Although without ending each statement with a semicolon, computer programs will most likely execute successfully.

console.log('Good Day!')
console.log('Happy Coding!')

There are a few cases when ending statements without a semicolon can lead to errors.

let a, b, c = 4, d = 8;
[ a, b = 6 ] = [ 2 ];

console.log(c) // 4 => no semicolon (error)

[ c, d ] = [ d, c ]; // TypeError: Cannot set property '8' of undefined

To remove the error just add a semicolon to line 4

Edit on Stackblitz

It is also a good practice to always end a statement with a semicolon because it makes the code more readable and understandable.

console.log('Good Day!');

const func = num => {
    console.log(num);
};
[1, 2].forEach(func);

In the example above, ending statements with a semicolon makes your code readable because it marks the end of a statement.


White Space

Apart from ending each statement with a semicolon for better readability, spaces make the code cleaner. A clustered code is difficult to read and understand.

console.log('Good Day!');
const func = num => {
    console.log(num);
};
[1, 2].forEach(func);

It would be better to separate each set of independent instructions with a new line and declare both variables and functions first in separate lines.

console.log('Good Day!');  // independent of the code below

const array = [1, 2];
const func = num => {
    console.log(num);
};

array.forEach(func);

image.png


Since words are usually separated by white space when writing a letter, an article, etc. In programming also, there's no exception to this rule.

const firstName = 'Osagie';
const lastName = 'Bello';
console.log('My name is ' + firstName + ' ' + lastName);

Statements are composed of values (Osagie and Bello), Operators (+ and =), keywords (const), and expressions (statements with = in-between keyword and value).

A statement can also be an expression without an equal sign assignment operator = only if it can be evaluated.

5 * 4; // an expression

Variables

Initialization of a variable to a value is done by an equal sign (=) in-between them.

const myName = 'Bello';

The value or data Bello, is assigned to a variable name, myName in the example above. In computer programming, the equal sign which separates the value and variable is called an assignment operator.


camelCase

The camelCase is a naming convention of variable, function, and class names to represent more than one word.

const myName = 'Bello';

myName is a two-word variable, my and name.

Happy Coding!!!


Buy me a Coffee


TechStack | Bluehost

  • Get a website with a free domain name for 1st year and a free SSL certificate.
  • 1-click WordPress install and 24/7 support.
  • Starting at $3.95/month.
  • 30-Day Money-Back Guarantee.

No Comments Yet