06/13
2014

javascript变量声明优先级


上一篇post讲了javascript的作用域和hoisting,在里面我也提到了function声明的优先级比var声明高,也就意味着当两个同名变量同时被functionvar声明时,function声明会覆盖var声明,如下:

alert(a);//输出:function a(){ alert('我是函数') }

function a(){ alert('我是函数') }//
var a = '我是变量';

alert(a);   //输出:'我是变量'

这代码等效于:

function a(){alert('我是函数')} 
var a;    //hoisting
alert(a);    //输出:function a(){ alert('我是函数') }
a = '我是变量';//赋值
alert(a);   //输出:'我是变量'

这短短的代码里面其实说明了两个问题:

  • function声明的优先级高于var声明:第一个alert输出可以看出var a;function a(){}覆盖掉了。
  • 赋值优先于函数声明:第二个alert输出可以看出a='我是变量'又把function a(){}覆盖掉了。

把一个变量添加到作用域中除有很多方法,如下:

  • javascript语言预定义的,比如说this,arguments
  • formal parameter(也就是中文说的形参吧)
  • var声明并赋值,比如说var a = 10;
  • var声明不赋值,比如说var a;
  • function声明,比如说function a(){};

我们来看看他们之间的优先级:

  • var声明并赋值优先级高于function声明 这个上面已经说了。

  • function声明优先级高于formal parameter

function fnTest(a){
    alert(a);
    function a(){return "我优先"}
}
fnTest(100);//:function a(){return "我优先"}。可以看出function声明覆盖了`formal parameter`。
  • formal parameter优先级高于预定义变量
function fnTest(arguments){
    alert(arguments);
}
fnTest(100);//:100。说明`formal parameter`优先级比预定义的arguments高

对比以下:

function fnTest(a){
    alert(arguments);
}
fnTest(100);//:[Object Arguments] {0:100,length:1}。当没有冲突时输出便是预定义的arguments
  • formal parameter优先级高于var声明不赋值
function fnTest(a){
    alert(a);
    var a;
}
fnTest(100);//:100。很明显,不多说
  • 预定义变量优先级高于 var声明不赋值
function fnTest(){
    alert(arguments);
    var arguments;
}
fnTest();//:[Object Arguments]。不是undefined,说明arguments没有被var声明覆盖
  • var声明不赋值优先级高于函数外部作用域的其他所有声明
function fnTest(){
    alert(fnTest);
    var fnTest;
}
fnTest();//:undefined。

对比如下:

function fnTest(){    //
    alert(fnTest);    //    
}    //
fnTest();    //输出function fnTest(){alert(fnTest);}

这也正好印证了作用域链查找变量的方式:在局部作用域里查找(若找到则返回,不必往下继续查找) ==> 在上一级作用域里查找... ==> 直到全局作用域(若找不到则返回typeError)

最后看看下面的综合例子:

function fnTest(arguments){
    alert(arguments);//function arguments(){return "hello world"}
    var arguments = 99;
    function arguments(){return "hello world"};
    alert(arguments);//99
}
fnTest(100);
blog comments powered by Disqus