<\/span><\/h2>\n\n\n\nScope is the boundary within which a variable is accessible. Generally, JavaScript variables have global or local scope. Global scope variables are accessible from any part of the JavaScript code. Local variables are accessible only within the function where they are defined.<\/p>\n\n\n\n
var a = 1;
function b(){
console.log(a*2); \/\/output is 2
}
b();<\/pre>\n\n\n\nIn the above example, the function b() is able to access the value of global variable.<\/p>\n\n\n\n
A function can access all variables that are defined in it as well as all global variables defined outside the function. If a function is defined inside another function, then such a function is called nested function, and the outer function is called parent function. A nested function can also access variables defined in its parent function.<\/p>\n\n\n\n
function out(){
var a=1;
function in(){
console.log(a*2); \/\/ output is 2
}
in();
}
out();<\/pre>\n\n\n\nIn the above code, nested function in() is able to access variable a defined in parent function out().<\/p>\n\n\n\n
But a function cannot access variables that are defined in another function that is not a parent function. Similarly, a parent function cannot access variables defined in its nested function. The following code will not work properly.<\/p>\n\n\n\n
function a(){
var c=1;
}
function b(){
console.log(c*2); \/\/output is undefined
}
b();<\/pre>\n\n\n\nSounds confusing? Sadly, it is so. If we are not careful about variable scope, your variables may end up getting modified without your knowledge and you may find it difficult to debug this problem.<\/p>\n\n\n\n
Suppose you want to create a simple counter function that keeps a count. And you want to make this accessible to all parts of your program. One of the simple ways is to use a global variable as shown below.<\/p>\n\n\n\n