JS函数内部标识符的使用顺序

在 JavaScript 函数结构中，一般包含以下类型的标识符。

• 函数参数。
• arguments。
• 局部变量。
• 内部函数。
• this。

其中 this 和 arguments 是系统默认标识符，不需要特别声明。这些标识符在函数体内的优先级是（其中左侧优先级要大于右侧）：this > 局部变量 > 形参 > arguments > 函数名。

示例1

下面示例将在函数结构内显示函数结构的字符串。

function f() {  //定义函数
    console.log(f);  //提示函数结构
}
f();  //调用函数，返回函数f

示例2

如果定义形参 f，则同名情况下参数变量的优先级会大于函数的优先级。

function f(f) {  //定义形参与函数同名
    console.log(f);  //提示标识符f的值
}
f(true);  //返回true，而不是函数f

示例3

比较形参与 arguments 属性的优先级。

function f(arguments) {  //函数形参名与参数属性arguments同名
    console.log(typeof arguments);  //提示参数的类型
}
f(true);  //返回boolean，而不是属性arguments的类型object

上面示例说明了形参变量会优于 arguments 属性对象。

示例4

比较 arguments 属性与函数名的优先级。

function arguments() {  //定义函数名与arguments属性名相同
    console.log(typeof arguments);  //返回arguments的类型
}
arguments();  //返回arguments属性的类型object

示例5

比较局部变量和形参变量的优先级。

function f(x) {  //定义普通函数
    var x = 10;  //定义局部变量并赋值
    console.log(x);  //显示变量x的值
}
f(5);  //传递参数值为5，返回提示为10

上面示例说明函数内局部变量要优先于形参变量的值。

示例6

如果局部变量没有赋值，则会选择形参变量。

function f(x) {
    var x;
    console.log(x);
}
f(5);

如果局部变量与形参变量重名，局部变量没有赋值，则形参变量要优先于局部变量。

示例7

下面示例演示当局部变量与形参变量混在一起使用时的微妙关系。

function f(x) {
    var x = x;  //把形参x传递给局部变量x
    console.log(x);
}
f(5);  //返回提示5

如果从局部变量与形参变量之间的优先级来看，则 var x = x 左右两侧都应该是局部变量。由于 x 初始化值为 undefined，所以该表达式就表示把 undefined 传递给自身。但是从上面示例来看，这说明左侧的是由 var 语句声明的局部变量，而右侧的是形参变量。也就是说，当局部变量没有初始化时，应用的是形参变量优先于局部变量。