浅析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 相关文章推荐
js获取当前select 元素值的代码
Apr 19 Javascript
避免 showModalDialog 弹出新窗体的原因分析
May 31 Javascript
jquery控制listbox中项的移动并排序的实现代码
Sep 28 Javascript
firefox下jQuery UI Autocomplete 1.8.*中文输入修正方法
Sep 19 Javascript
JS锚点的设置与使用方法
Sep 05 Javascript
jquery插件开发之选项卡制作详解
Aug 30 jQuery
Angular实现预加载延迟模块的示例
Oct 12 Javascript
AngularJS中controller控制器继承的使用方法
Nov 03 Javascript
Angular实现较为复杂的表格过滤,删除功能示例
Dec 23 Javascript
React Hooks的深入理解与使用
Nov 12 Javascript
JavaScript模板引擎实现原理实例详解
Dec 14 Javascript
js实现烟花特效
Mar 02 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
PHP4引用文件语句的对比
2006/10/09 PHP
php初学者写及时补给skype用户充话费的小程序
2008/11/02 PHP
php 归并排序 数组交集
2011/05/10 PHP
php入门学习知识点八 PHP中for循环基本应用之九九乘法口绝表
2011/07/14 PHP
PHP中浮点数计算比较及取整不准确的解决方法
2015/01/09 PHP
Laravel程序架构设计思路之使用动作类
2018/06/07 PHP
php实现 master-worker 守护多进程模式的实例代码
2019/07/20 PHP
php swoole多进程/多线程用法示例【基于php7nts版】
2019/08/12 PHP
js 屏蔽鼠标右键脚本附破解方法
2009/12/03 Javascript
在Ajax中使用Flash实现跨域数据读取的实现方法
2010/12/02 Javascript
javascript 内存回收机制理解
2011/01/17 Javascript
jquery删除指定子元素代码实例
2015/01/13 Javascript
Node.js+Express配置入门教程
2016/05/19 Javascript
Javascript中的arguments对象
2016/06/20 Javascript
jquery 动态增加删除行的简单实例(推荐)
2016/10/12 Javascript
微信小程序 网络API Websocket详解
2016/11/09 Javascript
jsonp跨域请求实现示例
2017/03/13 Javascript
微信小程序图片横向左右滑动案例
2017/05/19 Javascript
BootStrap下的弹出框加载select2框架失败的解决方法
2017/08/31 Javascript
JS设计模式之策略模式概念与用法分析
2018/02/05 Javascript
深入浅析JS中的严格模式
2018/06/04 Javascript
jQuery实现checkbox全选、反选及删除等操作的方法详解
2019/08/02 jQuery
Vue 一键清空表单的实现方法
2020/02/07 Javascript
TensorFLow用Saver保存和恢复变量
2018/03/10 Python
python 找出list中最大或者最小几个数的索引方法
2018/10/30 Python
对Python中plt的画图函数详解
2018/11/07 Python
Python实战购物车项目的实现参考
2019/02/20 Python
Python读取xlsx文件的实现方法
2019/07/04 Python
python和php学习哪个更有发展
2020/06/17 Python
详解tensorflow之过拟合问题实战
2020/11/01 Python
如何用tempfile库创建python进程中的临时文件
2021/01/28 Python
介绍一下Linux中的链接
2016/05/28 面试题
大学生简单自荐信
2013/11/10 职场文书
辞职信如何写
2015/02/27 职场文书
七一慰问简报
2015/07/20 职场文书
Python  序列化反序列化和异常处理的问题小结
2022/12/24 Python