Just five words to fix JavaScript scope (classic) _javascript tips

JavaScript is the scope of the front-end development has been more difficult to understand the point of knowledge, the scope of JavaScript mainly remember a few words, all over the world are not afraid ...

One, "no block-level scope in JavaScript"

There is a block-level scope in Java or C #, that is, curly braces are also a scope.

public static void Main ()
{if (1==1) {
String name = ' seven ';
}
SYSTEM.OUT.PRINTLN (name);
Error public
static void Main ()
{if (1==1) {
string name = ' seven ';
}
Console.WriteLine (name);
Error

No block-level scopes in the JavaScript language

function Main () {
if (1==1) {
var name = ' seven ';
}
Console.log (name);
Output: Seven

Second, JavaScript uses function scope

In JavaScript, each function acts as a scope and cannot be externally accessible to variables in the inner scope.

function Main () {
var innervalue = ' seven ';
}
Main ();
Console.log (innervalue);
Error: Uncaught referenceerror:innervalue is not defined

Iii. The scope chain of JavaScript

Because each function in JavaScript acts as a scope, the scope chain appears if function nesting functions occur.

XO = ' Alex ';
function Func () {
var xo = "Seven";
function inner () {
var xo = ' Alvin ';
Console.log (XO);
Inner ();
}
Func ();

If the above code shows three scope chain of scopes, if the scope chain, then the search for variables will appear in order, for the above example:

When the Console.log (XO) is executed, the search order is based on the priority of the scope chain from inside to outside, if the inner layer is not gradually looking up until the thrown exception is not found.

425762-20160707114743577-37359182.png

The scope chain of JavaScript was created before execution

The scope of JavaScript is created before it is executed, and it needs to be looked up by the scope chain when it is executed later.

Example one:

XO = ' Alex ';
function Func () {
var xo = "Seven";
function inner () {
console.log (XO);
}
return inner;
}
var ret = Func ();
RET ();
Output Result: Seven

The above code, the scope chain already exists before the function is invoked:

Global scope-> func function scope-> inner function scope

When the "ret ()" is executed, because its surrogate is the inner function, the scope chain of this function is defined before execution: global scope-> func function scope-> inner function scope, so when executing "ret ();" Will look for variables based on the existing scope chain.

Example two:

XO = ' Alex ';
function Func () {
var xo = "Eirc";
function inner () {
console.log (XO);
}
XO = ' seven ';
return inner;
}
var ret = Func ();
RET ();
Output Result: Seven

The preceding code is the same as the example one, emphasizing that the scope chain already exists before the function is invoked:

Global scope-> func function scope-> inner function scope

When executing "var ret = Func ()", the value of the XO variable in the FUNC scope has been reset to "seven" by "Eric", so you can only find "seven" when you perform the "ret ()".

Example three:

XO = ' Alex ';
function Bar () {
console.log (XO);
}
function Func () {
var xo = "Seven";
return Bar;
}
var ret = Func ();
RET ();
Output Result: Alex

The preceding code has created two chain of scopes before the function is executed:

Global scope-> Bar function scope

Global scope-> func function scope

When the "ret ()" is executed, a RET refers to the bar function, and the bar function's scope chain already exists: the global scope-> bar function scope, so the execution is looked up according to the existing scope chain.

V. Declaration of Advance

In JavaScript, if you do not create a variable and use it directly, an error occurs:

Console.log (Xxoo);
Error: Uncaught Referenceerror:xxoo is not defined

In JavaScript, if you create a value without assigning a value, the value is undefined, such as:

var Xxoo;
Console.log (Xxoo);
Output: undefined

If you write this in a function:

function Foo () {
console.log (XO);
var xo = ' seven ';
}
Foo ();
Output: undefined

The above code, which does not give an error, is output undefined, because the JavaScript function will declare all of its variables without assigning value until it is executed. So, as in the example above, the function has executed the Var xo when "precompiled", so the output from the above code is undefined.

The above is a small set to introduce you just five words to fix JavaScript scope (classic), I hope to help you, if you have any questions please give me a message, small series will promptly reply to everyone. Here also thank you very much for the cloud Habitat Community website support!