js parsing order scope strict mode parsing-JS Tutorial-php.cn

1. The parsing order of javascript

We all understand that the execution order of the code is from top to bottom, but in fact it is not like this. Let's take a look at the code below.

1 alert(a);
2 var a = 1;

Copy after login

If the execution order is from top to bottom, and an a pops up on top, the browser will think that it is executed from top to bottom, then when it alerts (a) When, he will find that there is no such thing, then he will report an error, but in fact the result he pops up is undefined. The return value is undefined, indicating that a is not defined, that is, it is not assigned a value. Now let me explain the parsing order of javascript.

　1. The declarative keywords in ES5

　var　will have variable promotion

　　function　and also have the effect of declaring variables.

　2. Parsing order

　　1. Find the declaration var, function declaration: only declare variables, not including assignments.

2. Execute

Note: The above two steps are followed from top to bottom. When executing the equal sign, look to the right side of the equal sign first.

Note: When a variable declared by function has the same name as a variable declared by var, the variable weight of function will be higher than that declared by var.

It will be much clearer with a few more examples below, but before looking at the examples, you need to know what scope is.

2. Scope

Scope is: the scope of action is divided into the following two types

　1. Global scope

　2. Function effect Domain

The difference between the two is analyzed carefully in the following example.

3. Let’s look at a few examples to analyze the steps of the execution sequence

1. The first example:

var x = 5;
    a();    
function a(){
        alert(x);        
        var x = 10;
    }
alert(x);

Copy after login

Analysis process

1. Find the declaration (see global scope)

var x;

function a(){}

2. Execute

　　x = 5; , look for the statement var x; (function scope)

　　　　　　 2. Execute

　　　　　　　 alert(x); This Then the thing that pops up is undefined;

2. The second example

<p style="margin-bottom: 7px;">a() function a(){<br/>    alert(x);    <br/>    var x = 10;<br/> }<br/>alert(x);<br/></p>

Copy after login

The parsing process is the same as the above example

1. Find the statement

　　function a(){}

　2. Execution

　　a()----------------------- -->Function

　　　　　　　1. Find the declaration

　　　　　　 var x;

　　　　　　　　　2. Execute

##　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　�　　　　　　　　　　　　　　　　　　�　 −･･ ##　　　　　　x = 10; ## So the pop-up content of the browser is undefined error

I believe that everyone who has read these two examples has a clear understanding of this parsing process. If you still don’t understand it well, it is recommended to read it again. .

The following introduces a few things that need attention. Let’s go directly to the example

3. The third example

As mentioned earlier, when the variables declared by function and the variables declared by var overlap When named, the variable weight of function will be higher than that declared by var. Let’s take an example to prove it

alert(a)function a() {
    alert("函数")
}var a = 1;  
alert(a)

Copy after login

Parsing process

1. Find the statement

function a(){}

var a;

2. Execute

alert(a) As mentioned earlier, the function declaration has a higher weight than the var declaration, so when this is executed, it will pop up the function block (function body ）

　a = 1;

　　alert(a); 　　What pops up here is 1

　　So the final result is function block 1; .Fourth example

The child scope can look for variables from the parent scope until it reaches the global scope, but not vice versa. If the child scope has the same variable, then he will use his own and will not ask his father for it.

var a = 5;function fn() {
    alert(a)
}

fn()

Copy after login

Parsing process

1. Find the statement

var a;

function fn(){}

　2. Execution

　a = 5;

　　fn()----------------------- ---------------> Function

　　　　　　　　　　　　　　　　　　　　　alert(a); 他这里没有a 所以去找爸爸要。 a = 5；所以弹窗是 5

　　所以最后结果为弹窗5

　　下面看一下爸爸会不会去找儿子要东西

function fn(){    
      var b = 5; 
    return b;    
}
fn();
alert(b);

Copy after login

　　1.寻找声明

　　　　function fn(){}

　　2. 执行

　　　　fn（）----------------------------------------> 函数

　　　　　　　　　　　　　　　　　　　　　　1.寻找声明

　　　　　　　　　　　　　　　　　　　　　　　　1.var b;

　　　　　　　　　　　　　　　　　　　　　　2.执行

　　　　　　　　　　　　　　　　　　　　　　　　return b;

　　alert(b); //我们看一下返回值是多少 b is not defined 他说b没有被定义，说明父作用域不可以向自作用域去寻找变量。

　5. 第五个例子

　　当一个变量无中生有时，不管从哪个作用域出来的，统统归到window下，下面看两个例子

  fn();
  alert(a);  var a = 0;
  alert(a);  function fn(){     var a = 1;
  }

Copy after login

这一个例子应该可以自己分析了最后的结果是 undefined 0

我们再来看一下下面这个你会很吃惊

  fn()
  alert(a)  
  var a = 0;
  alert(a);  
  function fn(){
      a = 1;
  }

Copy after login

　　明明都一样，我吃惊什么返回值不是还是 undefined 和 0 吗

　　但是你有没有发现倒数第二行上面的声明了下面的没有声明，来解析一波

　　1.寻找变量

　　　　var a;

　　　　function fn(){}

　　2.fn()---------------------------->函数

　　　　　　　　　　a = 1; 这个时候就说到了那一点，无中生有的变量，统统归到window下面

　　所以下面的执行过程

　　alert(a) 这里的弹窗就是 1 了

　　 a = 0;

　alert(a) 弹出 0

　　所以最后的结果是 1 0

四、严格模式

　　严格模式下的代码执行时，非常严格

　　变量不允许无中生有

　　意义：规范代码开发的流畅，逻辑

"use strict"a = 1；
alert(a);

Copy after login

当我们写后面两句代码的时候不会报错和出现问题，但是当我们加上第一句代码的时候，我们在这样写的时候就会报错了。所以我们还是按照规范的标准来,提高自己的能力

五、可能好多人做了上面的例子感觉不太过瘾，下面我再给出几个例子，可以自己去分析分析，我会在最后面给出答案。

1.　第一个例子　 // 10 报错

var a = 10;
alert(a);
a()function a(){
    alert(20);
}

Copy after login

2.第二个例子 undefined 1 0

var a = 0;    
function fn(){
        alert(a);        
        var a = 1;
        alert(a);
    }
    fn();
    alert(a);

Copy after login

3.第三个例子当同样的声明同样的名字重复时，后面写的会覆盖前面写的 //2 1 1 3

 a()    var a = function(){
        alert(1)
    }
    a();    function a(){
        alert(2);
    }
    a();    var a = function(){
        alert(3);
    }
    a()

Copy after login

The above is the detailed content of js parsing order scope strict mode parsing. For more information, please follow other related articles on the PHP Chinese website!