js作用域

今天学习了有关于js作用域的知识，了解js作用域，可以让我们清楚地知道每行代码它是怎样运行的，话不多说，进入正题。

当代码运行在浏览器中时，解析器负责解析，这就会涉及到有关作用域的问题。当代码进入了<script>标签或者一个function函数里面的时候就进入一个作用域，一旦进入到作用域之后就会执行两个步骤：

1、js预解析
去找var, function，方法参数

找到之后就会建立一个仓库，遇到var就会把变量赋值为undefined，然后放在仓库中；遇到function就会就会把function整个函数放在仓库里面。

2、js代码逐行执行
找表达式（++,--，+*，+/等表达式），找到之后就会修改预解析的内容

说得有些抽象，举个例子：

console.log(a);

var a=1;

function a(){alert(2);}

console.log(a);

var a=3;

console.log(a);

function a(){alert(4);}

console.log(a);

a();

这段代码的执行结果是：

代码执行的顺序是这样的：

1、预解析：

1）var =1--------->遇到var，a=undefined

2)function a(){alert(2);}----------->遇到function,整个函数放在仓库里面，现在仓库有a=undefined和 function a(){alert(2);}注意：当变量的名称和方法的名称一致的时候，会显示方法的名称，隐藏变量的名称。现在仓库只显示function a(){alert(2);}

3）var a=3;----------->a=undefined和函数名相同，还是只显示函数

4）function a(){alert(4);}----------->覆盖function a(){alert(2);}

最终仓库只显示function a(){alert(4);}

2、js代码逐行执行

console.log(a);-----------> 输出function a(){alert(4);}

var a=1;------------------> 修改内容，内容为1

function a(){alert(2);}

console.log(a);----------> 输出1

var a=3;-----------> 修改内容，为3

console.log(a);-----------> 输出3

function a(){alert(4);}

console.log(a);------------> 输出33

a();-------------> a未定义

另外一种情况是作用域套作用域，结果和现在的结果就不一样了，例如下面这种情况：

var a=1;

function fn1(){

alert(a);

var a=2;

}

fn1();     //新的作用域

console.log(a);

记住：如果嵌套里面没有var 或方法参数,就会去上一级找

这题的解题步骤如下：

1、预解析

1）var a=1------->a=undefined

2)function fn1(){alert(a);var a=2;}------------>function fn1(){alert(a);var a=2;}

因为现在仓库变量名和函数名不一样，现在仓库里有a=undefined和function fn1(){alert(a);var a=2;}

2、js代码逐行执行

var a=1; ----------->a=1

function fn1(){

alert(a);---------->预解析之后，a=undefined

var a=2;

}

fn1(); ------------->新的作用域，就会预解析fn1()

var a=2---------->a=undefined

console.log(a);------->1