JavaScript Scope Learning Notes

Source: Internet
Author: User

1, local variables and global variables;

    • Global variables

      The first thing to know is that the global variable execution environment is the global scope, and the global scope is the outermost execution environment that can be accessed anywhere in the code. In the browser, our global scope is window . So in the browser, all global variables and functions are window created as properties and methods of the object.

var name = "1"; function dosomething () {    var anothername = "2";     function ShowName () {        console.log (name)        Console.log (anothername)    }    ShowName ();} Console.log (name); // 1console.log (anothername); //Error dosomething (); //1, 2showname (); // Error

Here you can see the global variables, which can be accessed in that position;

Note: 1, but we also created inside the function of variables anotherName and functions showName() , through the call in the code can be found, we call it outside the prompt "error", because they are in the local scope (later), and The external environment cannot access any variables and functions inside the internal environment (inside the function) . -This involves local variables and scopes;

2, if the variable inside the function is not declared with Var, it will become a global variable; this can be said JS design problem it;

3. Another way to add a global variable is to add a property directly to the Window object. window.name=1; then name becomes a global variable;

    • Local variables

Local scope and global scope are just the opposite, local scopes are generally accessible only within a fixed code fragment, the most common is inside the function, so in many places it is called the function scope. (Remember that let(ES6) there was no block-level scope before)

function dosomething () {  var anothername = "2";   function ShowName () {            console.log (anothername)    }    ShowName ();} ShowName (); // Error

The reason is the function showName() , which has a local scope (that is, it can only be accessed inside the function). Therefore it cannot be accessed by the outside;

2. Scope Chain

Understand the following definition:

When code executes in an environment, a scope chain of variable objects is created (scope chain). The purpose of a scope chain is to ensure an orderly access to all variables and functions that the execution environment has access to. The scope chain contains variable objects that correspond to each execution environment in the environment stack. Through the scope chain, you can determine the access of variables and the parsing of identifiers. Note that the variable object for the global execution environment is always the last object in the scope chain.

 var  name = "Test1"  function   DoSomething () { var  anothername =" Test2 "     function   ShowName () { var  author = "Test3" ; Console (name) console (anothername)  //  Here you can access the name, Anothername, author  } showname ();  //  Here you can access the name Anothername, not access to the Author  }dosomething ();  //  Here you can only access the name  

The simple word is only from the "Inside" query to "outside", but not from the "outside" to "inside";

In JavaScript, each function has its own scope, and each time a function is called, it enters a scope within a function, and when the function executes, it returns to the scope before the call.

When code executes within a scope, a scope chain is created based on its context, and the purpose of the scope chain is to control the current scope for orderly access to all variables and functions within it. The front-end of the scope chain, which is always the variable object at the scope where the current execution code resides.

In DoSomething (), the function is under the global scope, and its scope chain contains two objects: 1. It itself is a variable object (the function will contain arguments objects), and 2. Global Environment object.

A variable can be accessed inside a function name because it is found in its scope.

Of course, as mentioned above, its scope chain: {Its own Variable object, global object}, the process of finding a search along the scope chain level, starting with the most front-end of the scope chain (its own variables) until the global environment, will not eventually find the error.

If we find it, we return the variable.

var name = "Test1"; function dosomething () {    var anothername = "Test2";     function ShowName () {        var author = "Test3";         var name= "test4"        console.log (name)        Console.log (anothername)           }    showname ();
}dosomething (); // the name is displayed as "test4";

Chestnuts: Run dosomething (), go into the scope of dosomething (), then run ShowName (), go to the showname () scope, run Console.log (name) inside, and then look for the variable name , which is found directly in the current scope, is returned;

Then it can also be seen as "back, away from the function of the nearest variable object" covered "The outermost variable object", also in line with our previous statement;


In fact, it is important to remember that in the authoritative guide, thefunctions in JavaScript run in the scope they are defined in, not in the scope in which they are executed;

var name = ' test1 '; function ShowName () {    console.log (name);} function Show () {    var name = ' Test2 ';    ShowName ();} Show ();

Look at a chestnut; according to our earlier statement,

Run Show (), enter the show () scope, then run ShowName (), and in the ShowName () scope, run Console.log at this point,

This is the time to look for the variable name, because ShowName is not found in the current scope, then go to the upper level of the scope; remember:

The functions in JavaScript run in their defined scopes, not in the scope in which they are executed;

The variable name is not looking inside the show (), but in the definition on the showname () place upward looking, therefore name= "test1" up;

But these are still the initial understanding of the scope. For some difficult words, still need to continue to study;

JavaScript Scope Learning Notes

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.