Code Structure Of JavaScript | Fundamentals of JavaScript Programming Language

Code Structure Of JavaScript | Fundamentals of JavaScript Programming Language | JavaScript Tutorial | Part - 1

What is JavaScript Programming Language?

JavaScript is among the most powerful and flexible programming languages that allows you to implement complex features on a website, such as dynamic elements or interactivity which is used by several websites for scripting the webpages and It is designed for creating network-centric applications.

Code Structure Of JavaScript (js) :

Writing well-structured code takes proper thinking, understanding of design patterns, and experience.

Here is a list of some of the fundamentals of JavaScript that you will learn about in this tutorial:

JavaScript Statements
JavaScript Semicolons
JavaScript Whitespaces
JavaScript Parenthesis
JavaScript Identifiers
JavaScript Indentation
JavaScript Reserved Keyword
JavaScript Case Sensitive
JavaScript Comments
JavaScript Camel Case

Here is a list of some of the fundamentals of JavaScript that you will learn about in next tutorial of Part - 2 :

JavaScript Syntax
JavaScript Values
JavaScript Literals
JavaScript Expression
JavaScript Variables
JavaScript Operators
JavaScript Character Set
JavaScript Data Types
JavaScript Code Blocks
JavaScript Line Length and Line Breaks

1. Statements in JavaScript (js) :

JavaScript is made up of a series of statements and semi-colons and a JavaScript program is a list of programming statements. JavaScript statements are the commands to tell the browser to what action to perform which are used to perform different actions based on different conditions.

A statement can set a variable equal to a value. A statement can also be a function call, i.e. document.write(). Statements define what the script will do and how it will be done.

Types of Statements in JavaScript (js):

We will provide a brief overview of each of the categories and cover them in greater detail later in the tutorial. There are five types of statements in javascript (js) :

Conditional Statements
Loop Statements
Object Manipulation Statements
Comment Statements
Exception Handling Statements

Example of Statements in JS :

let numOne, numTwo, sum;           // Statement 1
numOne = 5;                                 // Statement 2
numTwo = 6;                                // Statement 3
sum = numOne + numTwo;        // Statement 4

2. Semicolons (;) in JavaScript (js):

Semicolons (;) separate JavaScript statements which are the equivalent of a full stop and it is used to terminate a statement.

Semi-colons are not compulsory because the JavaScript or js parser will automatically add a semicolon during the parsing of the source code but using semicolons are highly recommended. Semicolons are used at end of the statements. When separated by semicolons, multiple statements on one line are allowed.

Example of Semicolons in JS :

// when single statements

let a, b, c;    
a = 5;         
b = 6;           
c = a + b;

// when multiple statements in one line

a = 5; b = 6; c = a + b;

3. Whitespace in JavaScript (js):

A whitespace character is an empty space (without any visual representation) on screen. Whitespace in JavaScript consists of spaces, tabs, and newlines (pressing ENTER on the keyboard).

JavaScript ignores multiple spaces and free to format and indent programs in a neat and consistent way that makes the code easy to read and understand.

Example of Whitespace in JS :

let person =      "Best JavaScript Tutorials";
let person="Best JavaScript Tutorials";

A good practice is to put spaces around operators ( = + - * / ):

let x = y + z;

4. Parenthesis in JavaScript (js):

In JavaScript we only write a value in the parentheses if we need to process that value and it is used for grouping expressions. For keywords such as if, switch, and for, spaces are usually added before and after the parentheses.

Example of Parenthesis in JS :

// An example of if statement syntax
if () { }

// Check math equation and print a string to the console
if (4 < 5) {
    console.log("4 is less than 5.");
}

// An example of for loop syntax
for () { }

// Iterate 10 times, printing out each iteration number to the console
for (let i = 0; i <= 10; i++) {
    console.log(i);
}

5. Identifiers in JavaScript (js):

Identifier is a sequence of characters; which help us to identify specific part of a program and The name of a variable, function, or property is known as an identifier in JavaScript.

Rules for Naming JavaScript Identifiers:

1. Identifiers should be meaningful.

2. Keywords should never be used as identifiers.

3. The first character can be an alphabet, underscore or dollar character.

4. The first character should not be a number.

5. All succeeding characters can be alphabets, a digits, or underscores.

6. No special characters are allowed except an underscore or dollar.

Example of Identifiers in JS :

i
my_variable_name
v13
_dummy
$str

6. Indentation in JavaScript (js):

Programmer uses newlines and indentation because of writing javascript program on a single line would quickly become very difficult to read and maintain.

There is no set standard for JavaScript code indentation. 4 spaces seems to be popular. Avoid using Tabs because Tabs may cause erratic behavior.

Example of Indentation in JS :

// Initialize a function
function isEqualToOne(x) {
    // Check if x is equal to five
    if (x === 5) {
        // on success, return true
          return true;
    } else {
          return false;
   }
}

7. Reserved Keyword in JavaScript (js):

Keywords are words in the JavaScript language that have a built-in functionality and cannot use to indicate variable labels or function names such as var, if, for, and this . There are a total of 63 keywords that JavaScript provides to programmers.

Example of Reserved Keyword in JS :

var var = "Reserve Keywords can not use as variable name";

Output:

SyntaxError: Unexpected token (1:4)

8. JavaScript is Case-sensitive:

The language keywords, variables, function names, and any other identifiers must always be typed with a consistent capitalization of letters is known as a case-sensitive language. JavaScript is also a case-sensitive language.

The identifiers Time and TIME is not same. It is different from each other.

Example of Case-sensitive in JS :

let course = "Best JavaScript Tutorials";
let COURSE = "JavaScript Tutorials for Beginners";

console.log(course);

console.log(COURSE);

Output :

Best JavaScript Tutorials
JavaScript Tutorials for Beginners

9. Comments in JavaScript (js):

Comments which describe what the code does and why and can be put into any place of a script which is ignored by the JavaScript engine i.e. embedded in the browser. JavaScript supports both C-style and C++-style comments.

Types of JavaScript Comments:

There are two types of comments in JavaScript:

Single-line Comment - //
Multi-line Comment - /* ...... */

One-line comments start with two forward slash characters //
Multiline comments start with a forward slash and an asterisk /* and end with an asterisk and a forward slash */

Example of Comments in JS :

/* An example with two messages.
This is a multiline comment in javascript
*/

// this is a single line comment in javascript

10. Camel Case in JavaScript (js):

Camel case is the practice of writing phrases without spaces or punctuation which is a naming convention in which the first letter of each word in a compound word and an initial lowercase or uppercase letter, with each remaining word element beginning with an uppercase letter.

Alternatively known as bicapitalisation, bicapitalization, InterCaps, medial capitals, and Pascal case,

Hyphens:

first-name, last-name, master-card, inter-city.

Hyphens are not allowed in JavaScript. They are reserved for subtractions.

Underscore:

first_name, last_name, master_card, inter_city.

Upper Camel Case (Pascal Case):

FirstName, LastName, MasterCard, InterCity.

Lower Camel Case:

JavaScript programmers tend to use camel case that starts with a lowercase letter:

firstName, lastName, masterCard, interCity.

Example of Camel Case in JS :

let postName = "Best JavaScript Tutorials";

Previous Post:

Way of Using JavaScript | Types of Using JavaScript | Inline-Internal-External JavaScript Tutorial

Next Post: