Explain Scope, Lifetime & Lexical Scope in Javascript
In the coming video, let’s look at what scope is.
In the last video, you learned about the scope and how it provides code security and helps to debug code faster and more efficiently. You also learned that there are two kinds of scope in JavaScript:
Local Scope - Anything inside a function is in its local scope.
Global Scope - Anything not inside any function is in its global scope.
In the next video, let us look at some examples to see what role scope plays in JavaScript.
In the last video, you looked at the examples of local and global scope.
An interesting point which you learned is that each function creates its own local scope, which is different from the local scope of other functions. This means that if a function has a variable defined in its scope and a variable with the same name has been defined in another function’s scope, then both these variables are different since they are defined inside two different functions, which create two different local scopes.
In the next video, let us look at some more examples to understand more about scope.
In the last video, you looked at two important aspects of scope:
The scope chain works from inward to outward. This means that a variable is looked for inside the local scope first. If the variable is found in the local scope, it is taken into consideration. In case the local scope does not contain the variable to be searched for, the control goes to the global scope to look for this variable. If the variable is found in the global scope, it is taken into consideration. If it is not found even in the global scope, then it means that the variable is not defined anywhere and thus, you get an error saying that the given variable is ‘not defined’.
If one function is called inside another function but both the functions are defined separately in the global scope, then a variable defined in one function cannot be referenced inside another function. This is because in such a case, both the functions have their different local scopes since they are defined separately in the global scope.
In the last video, you also learned what lifetime of a variable is. The lifetime of a variable starts when it is declared. If the variable is in local scope of a function, its lifetime ends when the function ends. If the variable is in global scope, its lifetime ends when the browser tab or window is closed.
At the end of the last video, you looked at an example where you had two functions defined separately inside the global scope and in one function, you were trying to access a variable which is defined inside the other function. And you know well that both these functions have different scopes and this is why, a variable defined in one function cannot be referenced inside another. Let’s now modify this example where the one function is defined inside the local scope of another function and try to access a variable defined in the outer function. This brings you to lexical scope. Let’s see how this works in the next video.
In the last video, you looked at what lexical scope is. Lexical scope refers to the fact that when one function, referred to as the parent function contains another function referred to as the child function, then the child function can access everything defined inside the parent function.
Lexical scope is also known as the static scope. Remember that in lexical scope, only a child function can access resources of its parents but a parent function cannot access resources of its children.