都知道js中不存在类似于c++等语言的块级作用域,例如for循环中定义的变量,其实是属于当前对象下的属性,同一对象下可以随便访问。只有函数可以限定一个变量的作用范围,即函数才是变量的作用域。
对于函数的变量访问时遵循作用域链的,即当前函数运行时会有一个当前作用域,当饮用某个变量时,会先查找当前作用域内是否存在该变量的定义,如果不存在则根据作用域链向上去查找父函数的作用域,有则拿来使用,没有则继续向上直到全局作用域。关于作用域链这里就不仔细描述,简单而言,类似原型链,从全局函数直到当前函数的作用域存在一种相互包含的关系,子可以向上访问,但是父不可以向下访问子函数的变量,这样层层嵌套的关系链。
类似这样的:
var num = 10; function a (){ alert(num); } a() //结果alert(10),a里没有num所以向上查找外层的作用域,有且等于10所以弹出10而不是undefined.
但是,下面的代码就是undefined了:
var num = 10;
var num = 10; function a (){ alert(num); var num = 11; }
为什么呢? a()执行时虽然num=11没有赋值但是父级作用域里是有num=10的,不应该是undefined呀,js是按顺序执行的,此时的var num = 11;根本没有执行,所以应该是10!!你是不是也是这么认为的,就和我当初一样。。
可以确定这样是对的,不信的小伙伴可以自己去试一试,如果你试的结果是10的话,那么一定是你写的不太一样。
来深究一下原因,这里就牵扯到js词法分析这个东西了。总所周知js代码自上而下执行,但是在js代码执行前,会先进行词法分析。所以js运行要分为词法分析和执行两个阶段。
js词法分析主要分为3个步骤:
1,分析形参:如果函数有形参,则给当前活动对象增加形参属性,默认为undefined。
2,分析变量声明:如果有类似var a 之类的声明,若没有该属性则增加属性,若已存在则不做操作。默认为undefined。变量的赋值在执行阶段才进行,即执行到该变量的时候才有 var a = 11
3,分析函数声明:类似 function a(){},若当前活动对象没有该属性则新增否则重写该属性为方法a。
所以回到开始的那段代码:
var num = 10; function a (){ alert(num); var num = 11; function b (){//nth to do } }
具体步骤:1,分析形参: 此处无形参则不进行操作;当有形参时:
function a (b){ alert(num); var num = 11; } a(4);
1,分析形参:则当前活动对象object.b = undefined; =>传入参数4则:object.b = 4;
2,分析变量声明: var num 则object.num = undefined;
3, 分析函数声明: function b(){} 则object.b = function(){};重写
4, 分析执行阶段,当运行到alert(num);时,认为num=10的想法是认为当前作用域没有num变量。该想法是错误的,其实下面只要有声明var num ;此时object.num = undefined,所以并不会向上去找父级作用域的num = 10;所以呢。。。就不是10了。
其实词法分析并不难,只不过原来的时候掌握的一直不清晰所以造成了该处的疑惑,希望能够帮到同样有需求的同学。