What to know while writing JavaScript (Important Concepts in JavaScript).

While writing JavaScript we Should take care of these important concepts and JavaScript will be fun....

1. Take care of Opening braces while writing functions in JavaScript.

2. Closures in JavaScript

3. Hoisting in JavaScript

4. Module Pattern in JavaScript

5. Less Use Of Global Variable (Scope) in JavaScript

1. Take care of Opening braces while writing functions in JavaScript.
JavaScript Interpreter Adds a Semicolon if the statement is not Closed.

function demo()

{

//your code

}

if you are using this style of function declaration then it may not work as expected because what the interpreter will do with this is like

function demo();  //notice the closing it adds to the declaration

{

//your code

}

The correct way of writing a JavaScript function is.

function demo(){

//your code

}

Hence, Take care of your function declaration and also take care of your closing on your own.

2. Closures in JavaScript

A first-class function that binds to free variables that are defined in its execution environment is a Closure.

var x=1;

function sum(){

    var y=4;

    print(x+y);    //x is global variable.

}

with the concept of closure there is bug that needs to be taken care of while writing functions.

Closure grabs Reference to the variable not the value.

var yourfunc = [];

 for (var i = 0; i < 8; i++) {

    yourfunc[i] = function() {

                               return i; 

                          }; 

} 

> yourfunc[4](); 

8

> yourfunc[6](); 

8

Here all the values return is 7 because only the last value of i is considered, Remember Closure grabs Reference to the variable not the value. And the last value of i is 7.

How to take care of this bug?

var yourfunc = [];

for (var i = 0; i < 8; i++) {

     yourfunc[i] = (function(n) {

                              return function() { return n; }

                            })(i);

} 

> yourfunc[4](); 

4

> yourfunc[6](); 

6

3. Hoisting in JavaScript

What will be the result of the following function?

var x= 1;

function yourfunc() {

if (!x) { 

                        var x= 5; } 

alert(x);}

yourfunc();

to your surprise it will be 5, Let me explain why..

Here the first declaration of x

var x= 1;

Assigns 1 to x. within the scope of if statement there is another declaration of x

Hence when if condition is checked it sees the declaration of x in its scope and ignores the global declaration. But here the problem starts, because the x is used before its declaration in if (!x) then the interpreter converts undefined value to false because JavaScript assumes undefined as false. The code with in if statement is executed and the final value of x is 5.Hence while declaring variables in JavaScript you need to consider the Hoisting of variables or you can get unexpected results.

4. Module Pattern in JavaScript

It defines and immediately executes an anonymous function.

syntax:

(function(parameters) { 

....yourcodes;//any thing here will be function scope, not             

 //Global scope.

})(parameters);

Module pattern is a very important concept to use in JavaScript. It helps to create a new Scope and Closure around it.

5. Less Use Of Global Variable (Scope) in JavaScript

Global scope is the most vulnerable part of the JavaScript if you have an api with some global variable then while extending that api may result in unwanted behavior if same variable name is used in the local code. 

Also, this is the place where hackers can use there logic to alter the program logic. Hence, use Module pattern and give no space for global variable in your code.