浅析JavaScript中的同名标识符优先级


Posted in Javascript onDecember 06, 2013

一,局部变量先使用后声明,不影响外部同名变量

var x = 1; // --> 外部变量x 
function fn(){ 
    alert(x);  // --> undefined 局部变量x先使用 
    var x = 2; // 后声明且赋值 
} 
fn(); 
alert(x); // --> 1<BR>

第一点,函数fn内第一句输出x,x是在第二句才定义的。这在JS中是允许的,这里的允许是指不会出现语法错误程序可以运行。

但在其它语言如C,Java中却是不允许的。变量必须先声明后使用,如

public class Test { 
    public static void main(String[] args) { 
        System.out.println(x); // 先使用 
        int x = 10; // 后声明 
    } 
}

Java中编译器会提示错误,程序无法运行。

第二点,函数fn内的局部变量x不会影响到外部的变量x。即fn内alert输出不是1,而是undefined。

二,形参优先级高于函数名

function fn(fn){ 
    alert(fn); 
} 
fn('hello'); // --> "hello"

可以看到函数名和形参同名都是fn,输出的是字符串"hello",却不是函数fn的函数体(fn.toString())。

三,形参优先级高于arguments

function fn(arguments){ 
    alert(arguments); 
} 
fn('hello'); // --> "hello"<BR>

arguments对象可以直接在函数内使用,是语言本身提供的一个 特殊标识符 。

这里刚好将形参声明成与其同名。输出可以看到是"hello"而非"[object Object]",即形参arguments覆盖了语言本身提供的真正的arguments。

四,形参优先级高于只声明却未赋值的局部变量

function fn(a){ 
    var a; 
    alert(a); 
} 
fn('hello'); // --> "hello"

函数fn形参为a,函数内第一句仅声明局部变量a,却并未赋值。从输出结果是"hello"而非undefined可以看出形参a优先级高于仅声明却未赋值的局部变量a。

五,声明且赋值的局部变量优先级高于形参

function fn(a){ 
    var a = 1; 
    alert(a); 
} 
fn('hello'); // --> "1"

函数fn形参为a,函数内第一句仅声明局部变量a,赋值为1。从输出结果是"1"而非"hello"可以看出声明且赋值的局部变量a优先级高于形参a。

六,形参赋值给同名局部变量时

function fn(a){ 
    var a = a; 
    alert(a); 
} 
fn('hello');

暂不运行,猜测下结果。如果按照第五点:声明且赋值的局部变量优先级高于形参。那么a将是undefined。但实际上a是"hello",即右a是形参a,左a才是局部变量a。

浅析JavaScript中的同名标识符优先级

这里的两个a互不干扰,谁也没覆盖谁。这与刚刚说的赋值的局部变量优先级高于形参又矛盾了。但引擎这样做的确是我们想要的,因为并不希望var a = a后a是undefined。

Javascript 相关文章推荐
jquery 学习笔记 传智博客佟老师附详细注释
Sep 12 Javascript
jquery 实现表单验证功能代码(简洁)
Jul 03 Javascript
jquery制作居中遮罩层效果分享
Feb 21 Javascript
node.js中的path.sep方法使用说明
Dec 08 Javascript
JQuery中使文本框获得焦点的方法实例分析
Feb 28 Javascript
JavaScript汉诺塔问题解决方法
Apr 21 Javascript
详解JavaScript时间处理之几个月前或几个月后的指定日期
Dec 21 Javascript
JavaScript代码判断输入的字符串是否含有特殊字符和表情代码实例
Aug 17 Javascript
Windows安装Node.js报错:2503、2502的解决方法
Oct 25 Javascript
JavaScript 判断对象中是否有某属性的常用方法
Jun 14 Javascript
简述ES6新增关键字let与var的区别
Aug 23 Javascript
详解React 条件渲染
Jul 08 Javascript
如何判断元素是否为HTMLElement元素
Dec 06 #Javascript
随鼠标上下滚动的jquery代码
Dec 05 #Javascript
js简单实现删除记录时的提示效果
Dec 05 #Javascript
Jquery 切换不同图片示例代码
Dec 05 #Javascript
jquery 快速回到页首的方法
Dec 05 #Javascript
JS验证邮箱格式是否正确的代码
Dec 05 #Javascript
javascript eval(func())使用示例
Dec 05 #Javascript
You might like
ThinkPHP之R方法实例详解
2014/06/20 PHP
浅谈ThinkPHP5.0版本和ThinkPHP3.2版本的区别
2017/06/17 PHP
PHP发送邮件确认验证注册功能示例【修改别人邮件类】
2019/11/09 PHP
javascript中有趣的反柯里化深入分析
2012/12/05 Javascript
[JSF]使用DataModel处理表行事件的实例代码
2013/08/05 Javascript
JavaScript实现把rgb颜色转换成16进制颜色的方法
2015/06/01 Javascript
jQuery unbind 删除绑定事件详解
2016/05/24 Javascript
jQuery为动态生成的select元素添加事件的方法
2016/08/29 Javascript
JavaScript每天必学之事件
2016/09/18 Javascript
功能强大的jquery.validate表单验证插件
2016/11/07 Javascript
详解从Vue.js源码看异步更新DOM策略及nextTick
2017/10/11 Javascript
微信小程序icon组件使用详解
2018/01/31 Javascript
详解Vue2.0配置mint-ui踩过的那些坑
2018/04/23 Javascript
Vue.js实现开发购物车功能的方法详解
2019/02/22 Javascript
webpack4.x下babel的安装、配置及使用详解
2019/03/07 Javascript
vue中@change兼容问题详解
2019/10/25 Javascript
JS正则表达式常见函数与用法小结
2020/04/13 Javascript
Python isinstance判断对象类型
2008/09/06 Python
Python实现在Linux系统下更改当前进程运行用户
2015/02/04 Python
PyCharm设置每行最大长度限制的方法
2019/01/16 Python
使用python serial 获取所有的串口名称的实例
2019/07/02 Python
python boto和boto3操作bucket的示例
2020/10/30 Python
浪费资源的建议书
2014/03/12 职场文书
旅游安全协议书
2014/04/21 职场文书
中学生教师节演讲稿
2014/09/03 职场文书
2014年工程工作总结
2014/11/25 职场文书
领导干部考核评语
2015/01/04 职场文书
全国爱眼日活动总结
2015/02/27 职场文书
公司年会主持词范文!
2019/05/07 职场文书
2019年房屋委托租赁合同范本(通用版)!
2019/07/17 职场文书
500字作文之难忘的同学
2019/12/20 职场文书
python字符串常规操作大全
2021/05/02 Python
Pytest中conftest.py的用法
2021/06/27 Python
nginx内存池源码解析
2021/11/20 Servers
Java中的继承、多态以及封装
2022/04/11 Java/Android
MySQL分区路径子分区再分区
2022/04/13 MySQL