从JavaScript的函数重名看其初始化方式


Posted in Javascript onMarch 08, 2007

今天有个哥们问我要是JavaScript函数重名了会有什么后果?开始我没有细想,就说可能会出错吧,可是等我实验完了发现页面没有任何脚本错误提示,而且程序也运行了,只是对同名函数的调用执行了位置靠后的一个。

    回头仔细一想,这个结果完全可以接受,因为脚本在页面里本身就是顺序执行下来的,包括函数的定义,但然如果只是定义 function foo(){} 这种形式,我们是跟踪不到函数初始化的。可是如果是定义类的方式,我们就可以明显地跟踪到函数的初始化顺序。比如:

从JavaScript的函数重名看其初始化方式function foo() {}
从JavaScript的函数重名看其初始化方式
function foo.prototype.fn1() {}
从JavaScript的函数重名看其初始化方式
function foo.prototype.fn2() {}

    我们就可以明显地看到先执行function foo.prototype.fn1(){}再执行function foo.prototype.fn2(){}。

    回到我们刚才说的JavaScript脚本函数重名问题上来,比如我们定义两个函数 funAlert():

从JavaScript的函数重名看其初始化方式function funAlert()
从JavaScript的函数重名看其初始化方式{
从JavaScript的函数重名看其初始化方式    alert('A');
从JavaScript的函数重名看其初始化方式}
从JavaScript的函数重名看其初始化方式
从JavaScript的函数重名看其初始化方式
function funAlert()
从JavaScript的函数重名看其初始化方式{
从JavaScript的函数重名看其初始化方式    alert('B');
从JavaScript的函数重名看其初始化方式}

    调用 funAlert(),那么将显示一个MegBox,内容为'B'。

    为什么初始化函数会有这样的效果?这里只用把上面两个函数的定义改一下,就会一目了然了,我们把定义改为:

从JavaScript的函数重名看其初始化方式var fnAlert = new Function("alert('A')");
从JavaScript的函数重名看其初始化方式
var fnAlert = new Function("alert('B')");
从JavaScript的函数重名看其初始化方式
从JavaScript的函数重名看其初始化方式window.fnAlert();
    其函数也就是定义在对象上的一个函数指针,我们象这个指针赋什么函数引用,它就执行什么效果,而JavaScript中的脚本函数重名就和普通赋值语句一样,等同于:
从JavaScript的函数重名看其初始化方式var i = 0;
从JavaScript的函数重名看其初始化方式
var i = 1;
    // 稍微注意以下JavaScript里的var,用var定义变量和我们平时用的高级语言定义变量是不同的,它只起到一个提示的作用,提醒说我在这里定义变量了,而没有什么变量作用域的概念,只要不离开定义它的对象的域(比如页面刷新),出现过的变量会就一直存在。所以var写不写都行。举个例子:
从JavaScript的函数重名看其初始化方式if ( true )
从JavaScript的函数重名看其初始化方式{
从JavaScript的函数重名看其初始化方式   t 
= 100;
从JavaScript的函数重名看其初始化方式}
从JavaScript的函数重名看其初始化方式alert(t);

    将显示100,而

从JavaScript的函数重名看其初始化方式if ( true )
从JavaScript的函数重名看其初始化方式{
从JavaScript的函数重名看其初始化方式    
var t = 100;
从JavaScript的函数重名看其初始化方式}
从JavaScript的函数重名看其初始化方式alert(t);

    也是显示100。

    所以JavaScript的脚本函数名重不重复只是一个运算的问题,和我们高级语言里的语法约束完全不是一回事,当然也更不是overload的范畴。

    脚本函数名重名有什么用呢?最直观就是可以用来实现伪重载,比如我们不少免费的主页空间常常会给你强加弹出窗口广告,我们就可以在页面第一行写上:

<script language="javascript">
    var _open = window.open;
    window.open 
= function() {}
</script>
    这样就可以屏蔽掉不是加在页面第一行上的弹出窗口广告(加在第一行不能拦截,因为window.open还没有被'重载'open就先执行了)。
Javascript 相关文章推荐
jquery实现兼容浏览器的图片上传本地预览功能
Oct 14 Javascript
javascript实现类似百度分享功能的方法
Jul 27 Javascript
jquery实现简易的移动端验证表单
Nov 08 Javascript
JQuery点击事件回到页面顶部效果的实现代码
May 24 Javascript
JavaScript中递归实现的方法及其区别
Sep 12 Javascript
React Native react-navigation 导航使用详解
Dec 01 Javascript
关于vue中的ajax请求和axios包问题
Apr 19 Javascript
对angular2中的ngfor和ngif指令嵌套实例讲解
Sep 12 Javascript
Angular.JS读取数据库数据调用完整实例
Jul 02 Javascript
Vue 解决在element中使用$notify在提示信息中换行问题
Nov 11 Javascript
详解Vue中的自定义指令
Dec 07 Vue.js
React中使用Vditor自定义图片详解
Dec 25 Javascript
翻译整理的jQuery使用查询手册
Mar 07 #Javascript
用window.location.href实现刷新另个框架页面
Mar 07 #Javascript
javascript中的location用法简单介绍
Mar 07 #Javascript
JsEasy简介 JsEasy是什么?与下载
Mar 07 #Javascript
动态控制Table的js代码
Mar 07 #Javascript
js+FSO遍历文件夹下文件并显示
Mar 07 #Javascript
学习js所必须要知道的一些
Mar 07 #Javascript
You might like
地球防卫队:陪着奥特曼打小怪兽的人类力量 那些经典队服
2020/03/08 日漫
杏林同学录(六)
2006/10/09 PHP
PHP 代码规范小结
2012/03/08 PHP
Linux(CentOS)下PHP扩展PDO编译安装的方法
2016/04/07 PHP
因str_replace导致的注入问题总结
2019/08/08 PHP
解决laravel 出现ajax请求419(unknown status)的问题
2019/09/03 PHP
基于jQuery的让非HTML5浏览器支持placeholder属性的代码
2011/05/24 Javascript
jquery实现简单的拖拽效果实例兼容所有主流浏览器
2013/06/21 Javascript
一个通过script自定义属性传递配置参数的方法
2014/09/15 Javascript
jquery插件star-rating.js实现星级评分特效
2015/04/15 Javascript
简介JavaScript中Math.cos()余弦方法的使用
2015/06/15 Javascript
使用ngView配合AngularJS应用实现动画效果的方法
2015/06/19 Javascript
你有必要知道的25个JavaScript面试题
2015/12/29 Javascript
jquery控制页面的展开和隐藏实现方法(推荐)
2016/10/15 Javascript
jQuery 判断元素整理汇总
2017/02/28 Javascript
jq checkbox 的全选并ajax传参的实例
2017/04/01 Javascript
解决vue+webpack打包路径的问题
2018/03/06 Javascript
jQuery实现文字超过1行、2行或规定的行数时自动加省略号的方法
2018/03/28 jQuery
微信小程序template模板与component组件的区别和使用详解
2019/05/22 Javascript
详解Vue 如何监听Array的变化
2019/06/06 Javascript
在微信小程序中使用vant的方法
2019/06/07 Javascript
[00:36]DOTA2风云人物相约完美“圣”典 12月17日不见不散
2016/11/30 DOTA
Python中动态获取对象的属性和方法的教程
2015/04/09 Python
python实现逆波兰计算表达式实例详解
2015/05/06 Python
Python实现模拟分割大文件及多线程处理的方法
2017/10/10 Python
numpy.linspace 生成等差数组的方法
2018/07/02 Python
python正向最大匹配分词和逆向最大匹配分词的实例
2018/11/14 Python
Python3标准库总结
2019/02/19 Python
Python 自动登录淘宝并保存登录信息的方法
2019/09/04 Python
文字自荐书范文
2014/02/10 职场文书
化妆品店促销方案
2014/02/24 职场文书
单位委托书范本
2014/04/04 职场文书
投资合作协议书范本
2014/04/17 职场文书
自荐信格式范文
2015/03/04 职场文书
2016年六一文艺汇演开幕词
2016/03/04 职场文书
Python+Matplotlib+LaTeX玩转数学公式
2022/02/24 Python