Hii,
In this blog i am going to discuss about scope in Javascript and how we can use it.
- Being a JavaScript developer one should have proper knowledge about JavaScript scope.
- JavaScript scope specifies objects,function and set of variables which can be defined either as global scope or local scope,both is used to refer the current context of code,the only difference between them is of variables accessibility which is noticed only at runtime.
- If you want to be a good javascript developer you must understand where the defined variables or functions will be accessed,and where you can change the scope of code’s context.
- If you will use javascript scope properly you will be able to write more maintainable,reuseable,short code easily with faster debugging.
- Whenever a javascript function is called scope and context are always associated with it but both scope and context have different functionality from each other, scope is function-based where as context is object-based.i.e whenever a function is called,each time a unique scope specifies the variable access of a function.Context specifies the object with the value of 'this' keyword which point out the currently executing code.
Javascript local scope:
- Javascript local scope is a type of variable that can be declared inside any function.
- Whenever a function is created a local scope is created and it is destroyed when the function is executed.
- Local scope can be accessed only inside the function.
- In nested functions local scope defined inside the inner function is linked with the outer function.
- Local variable and global variable can be of same name, because their variables accessibility is seperate from each other.
- If we change the value of any of the scope variable it does'not effect the other one.
- Any variable declared inside a function is locally scoped.
Example 1:
In this example you will see that the local variable bookName cannot be accessed from code outside the function:
<body>
<p id="scope"></p>
<script>
myFunction();
document.getElementById("scope").innerHTML =
"The type of bookName is " + typeof bookName;
function myFunction() {
var bookName = "Bible";
}
</script>
</body>
Output:The type of bookName is undefined.
Example 2:
In this example both global and local scope have same name,but in the output you can see, globally created variable is accessed.
<script>
// Global definition of book.
var book = "There are many books,";
// A local variable book is declared in this function.
function myFunction(){
var book = "Choose your favourite.";
}
myFunction();
book += "you can read them.";
document.write(book);
</script>
Output: "There are many books, you can read them."
Javascript global scope:
- Javascript global scope is a type of variable that can be declared outside the function, its value is created only once, and it is accessible and modifiable throughout your program and its value does'nt get destroyed on function execution but it is destroyed when we close the program.
- Global scope is window's object and it is declared before a function is created, and it is mostly used when we want to create Modules/APIs that are accessible across scopes.
Example 3:
In this example you will see that the global variable bookName can be accessed from code outside the function:
<body>
<p id="scope"></p>
<script>
myFunction();
document.getElementById("scope").innerHTML =
"The type of bookName is " + bookName;
function myFunction() {
bookName = "Bible";
}
</script>
</body>
Output:The type of bookName is Bible.
0 Comment(s)