浅析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.ajax的url中传递中文乱码问题的解决方法
Feb 07 Javascript
JavaScript中的typeof操作符用法实例
Apr 05 Javascript
JS替换字符串中空格方法
Apr 17 Javascript
基于JQuery和CSS3实现仿Apple TV海报背景视觉差特效源码分享
Sep 21 Javascript
JavaScript实现图片自动加载的瀑布流效果
Apr 11 Javascript
JS实现加载和读取XML文件的方法详解
Apr 24 Javascript
WebSocket的通信过程与实现方法详解
Apr 29 Javascript
详解puppeteer使用代理
Dec 27 Javascript
使用vue-cli脚手架工具搭建vue-webpack项目
Jan 14 Javascript
简单通过settimeout看javascript的运行机制
May 10 Javascript
vuex vue简单使用知识点总结
Aug 29 Javascript
vue+flask实现视频合成功能(拖拽上传)
Mar 04 Vue.js
如何判断元素是否为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
PHP安全配置
2006/10/09 PHP
isset和empty的区别
2007/01/15 PHP
php 多线程上下文中安全写文件实现代码
2009/12/28 PHP
php INI配置文件的解析实现分析
2011/01/04 PHP
destoon整合UCenter图文教程
2014/06/21 PHP
php计划任务之验证是否有多个进程调用同一个job的方法
2015/12/07 PHP
JavaScript中Math对象使用说明
2008/01/16 Javascript
javascript history对象(历史记录)使用方法(实现浏览器前进后退)
2014/01/07 Javascript
控制台报错object is not a function的解决方法
2014/08/24 Javascript
浅谈EasyUI中编辑treegrid的方法
2015/03/01 Javascript
jquery实现图片水平滚动效果代码分享
2015/08/26 Javascript
vue.js表格组件开发的实例详解
2016/10/12 Javascript
实例解析Array和String方法
2016/12/14 Javascript
Node解决简单重复问题系列之Excel内容的获取
2018/01/02 Javascript
JavaScript实现单英文金山打字通
2020/07/24 Javascript
解决vue打包后vendor.js文件过大问题
2019/07/03 Javascript
如何给element添加一个抽屉组件的方法步骤
2019/07/14 Javascript
vue 的 solt 子组件过滤过程解析
2019/09/07 Javascript
react用Redux中央仓库实现一个todolist
2019/09/29 Javascript
[48:24]完美世界DOTA2联赛循环赛LBZS vs Forest 第一场 10月30日
2020/10/31 DOTA
跟老齐学Python之大话题小函数(2)
2014/10/10 Python
使用python绘制常用的图表
2016/08/27 Python
Python利用scapy实现ARP欺骗的方法
2019/07/23 Python
浅析NumPy 切片和索引
2020/09/02 Python
eBay爱尔兰站:eBay.ie
2019/08/09 全球购物
JavaScript实现前端网页版倒计时
2021/03/24 Javascript
绘画设计学生的个人自我评价
2013/09/20 职场文书
高中生的学习总结自我鉴定
2013/10/26 职场文书
酒店管理专业毕业生推荐信
2013/11/10 职场文书
小学生开学第一课活动方案
2014/03/27 职场文书
工业自动化专业自荐信范文
2014/04/10 职场文书
卫生院艾滋病宣传活动小结
2014/07/09 职场文书
政府个人对照检查材料思想汇报
2014/10/08 职场文书
运动会开幕词
2015/01/28 职场文书
销售工作决心书
2015/02/04 职场文书
公司财务经理岗位职责
2015/04/08 职场文书