Oct 1, 2014

JavaScript Quiz-2

1. JavaScript variable scoping : Understanding of scope of variable at Function level and Global.
What will be displayed on console ?
var name = "Nikhil";

function display() {
 var name = "Zytham"; // local variable declare and initialise 
 console.log (name); 
}
console.log (name);
display();

Sample output:
Nikhil
Zytham

Explanation:-
Javascript has broadly classified scope of variable at two level - Function level and Global scope.
Inside function display() variable name is declared and initialised so console.log (name) prints Zytham. However, console.log(name) outside function refers variable declared on top as "Nikhil"

2. JavaScript variable scoping : Understanding of scope of variable and declaration / initialisation of variables.
What will be displayed on console ? 
var name = "Nikhil";

function display() {
 name = "Zytham"; // Hint: variable initialised or reassigned new value ?  
 console.log (name); 
}
display();
console.log (name);

Sample output
:
Zytham
Zytham

In Javascript, if variable is not declared directly initialised inside function then - either a global variable is created or if variable has already declared then its value is overridden.
On execution of display() function - value of global name is overridden. That' why output is Zytham for both console.log(name) - within function and outside function.

Note
:- If we swap order of display(); console.log (name); then result will be different. Reason, it's obvious. Nikhil is not overridden by Zytham.
> console.log (name);
Nikhil
> display()
Zytham


3. Does JavaScript support block level scoping ? What will be output ?
var name = "Nikhil";
// HInt: Blocks not function - No local context for the name variable​
if (name) {
 name = "Ranjan"; 
 console.log (name); 
}

Sample output
: -
Ranjan

JavaScript does not have support of block level scope. Any member variable referenced in block is global variable. If it has been declared earlier then its value will be modified or global variable will be created.

Note:- If user does not declare variable and directly initialises it, JavaScript does declaration task for us and that variable is added in global context.
Any variable declared or initialised outside a function is a global variable, and it is therefore available to the entire application.
// Global variable can be declared in following ways:​

//1. Declare and initialise  
var globalname = "Nikhil";

//2. Just initialise, Javascript will take care of declaration task  
globaladdress = "India";

4. JavaScript Variable Hoisting - Only declared variable is hoisted, not initialised one.
function showName () {
 console.log ("Try printing Name : " + name);
 var name = "Nikhil";
 console.log ("Try printing Name again : " + name);
}
showName()

Sample Output
:-
Try printing Name : undefined
Try printing Name again : Nikhil

A variable used without declaration, JavaScript does declaration internally. All variable declarations are hoisted (pushed and declared) to the top of the function, if defined in a function, or the top of the global context, if outside a function. Here it will be declared on top of function.

First name displayed as "Undefined" as it has been declared by JavaScript but not initialised. However, on second run it displays "Nikhil" - since local variable name is declared and initialised. One important thing to be noted here is name is declared and initialised as "Nikhil" - JavaScript will override name variable that has been declared previously.

How JavaScript engine processes above sample code ?
function showName () {
 var name; //javascript Hoisting, declared on top
 console.log ("Try printing Name : " + name);
 name = "Nikhil"; //above declared variable is overridden
 console.log ("Try printing Name again : " + name);
}
showName()

5. Function Declaration Overrides Variable Declaration When Hoisted. Predict output ?
// Both the variable and the function are named myName​
var myName;
function myName () {
 console.log ("Ranjan");
}
console.log(typeof myName); 

Sample Output
:-
function

Both function declaration and variable declarations are hoisted to the top of the containing scope. And function declaration takes precedence over variable declarations (but not over variable assignment).If the variable is initialised, it overrides the function declaration​.Variable assignment is not hoisted, and neither is function assignment.
Above function myName() declaration overrides variable declaration. So typeof operator prints "function".

7. Variable and function with same name but variable is initialised. Predict outcome ?
var myName = "Richard"; 

function myName () {
console.log ("Rich");
}
console.log(typeof myName); 

Sample output:-
String

8. JavaScript setTimeout :- The setTimeout() method calls a function or evaluates an expression after a specified number of milliseconds. General syntax of setTimeout is:
setTimeout(function, milliseconds, param1, param2, ...)
Note:- setTimeout Variables are Executed in the Global Scope. Predict output of below sample ?

var salary = 200;
var tax = 20;
var employee = {
 name : "Nikhil",
 salary : 100,
 tax : 30,
 compute: function(){ 
  console.log("Salary computing ......")
  setTimeout (function() {
  console.log(this.salary -  this.tax);}, 
    2000);
 }
}
//call compute function on employee object 
employee.compute()

Sample output
:-
Salary computing......
180
Location: Hyderabad, Telangana, India