/*十有三博客*/
  • 首页
  • 关于本站
  • 网站地图
  • RSS订阅

Javascript方法的覆盖和重写

2014-09-28 十有三 0 浏览:2万+ Web前端 Javascript

本文主要介绍一个javascript特殊技巧,就是方法的覆盖和重写。一般来说,如果在JS中定义了两个相同名称的函数/方法,那么前一个函数等于定义无效,后一个函数才是有效的定义。也就是说如果有多个同名函数和方法,只有后定义函数和方法有效,所有前面定义的函数都算是无效的定义,顺序是从上而下的,即使参数不同也算是无效,因为判断依据只有函数名!!!这里有别于C#和JAVA语言之类的方法重载,只能算是重写,其实JS本来也没有方法重载,如果真的要实现方法重载具体要看这篇文章:javascript 实现函数/方法重载。

如何实现JS方法的覆盖和重写

其实要实现重写和覆盖是十分简单的,只要在要重写和覆盖的函数下面在定义一个同名的函数就可以了。先看下面这段方法重写示例代码(可直接复制到TXT文本中,另存为HTML就可以运行):

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <script type="text/javascript">
        function ShowMessage()
        {
            alert("11111111111!");
        }
        function ShowMessage(msg) {
            alert("提示信息:"+msg);
        }
        function ShowMessage() {
            //最终会弹出这里的提示,前面的两个函数定义是无效的!
            alert("提示信息三!");
        }
    </script>
</head>
<body>
    <input type="button" value="点击弹出提示信息" onclick="ShowMessage('测试传入参数');"/>
</body>
</html>

在上面的代码中,一共声明了三个同名函数ShowMessage,其中第二个ShowMessage函数还带有参数。虽然在按钮的点击事件中我们传入了函数的参数,但是最终还是执行最后一个定义的函数,即最终会弹出"提示信息三!"的对话提示框。所以才说JS没有像其他编程语言那样拥有重载的功能,只能自己利用一些技巧模拟出重载的效果。

JS重写适用的范围和注意事项!

重写和覆盖函数在一定程度上给予了开发者极大的方便,比如由于业务逻辑的需求,我们可以在特定的页面重写和覆盖掉原本的方法,从而重新编写出新的功能。

但是要注意的是,即使是JS的原本内部方法,也是会被覆盖掉,比如下面的代码:

<script type="text/javascript">
    function Array() {
        alert('数组构造函数被覆盖和重写了!');
    }
    function ShowMessage() {
        /*
        * 由于在此函数之前已经重新定义了一个Array()函数,
        * 所以当执行到下面的数组声明时,会执行上面的函数弹出一个警告框
        */
        var arr = new Array();
    }
</script>

我们可以看到JS的内部方法Array()也是可以被我们重写,这里是值得注意的,因为早些时候有个JSON劫持的漏洞有利用到此特性。另外从这里我们还可以发现,既然连JS原本的内部函数都可以进行覆盖,那么也就可以很轻松的对Object()函数进行覆盖和重写,也许在某些时候会用到这个特性来进行对象的构造函数的扩展操作。

还有另外一点要注意是,在利用这个便利的特性的同时,我们也要注意可能因为函数命名的相同而意外导致原本函数功能被重写和覆盖掉,造成某些严重的BUG和错误。毕竟在一个项目中开发人员总是会有变动,不熟悉项目的开发人员可能会被这个问题所困扰,确保函数命名不重复也是十分重要的。


作者:十有三

出处:https://shiyousan.com/post/635474468161025927

版权声明:本文采用知识共享许可协议:署名-相同方式共享 4.0 国际(CC BY-SA 4.0)。欢迎转载本文,转载请声明出处或保留此段声明。


  • 上一篇: SQL使用ROW_NUMBER函数获取没有ID的当前数据的上下文数据(上一条和下一条)
  • 下一篇: javascript 实现函数/方法重载效果

相关文章
  • CKEditor 4.4.1 添加代码高亮显示插件功能--使用官方推荐Code Snippet插件
  • 百度站内搜索如何设置和使用自定义样式设计(即不使用模板,使用自定义的模板)
  • jquery ajax error函数和及其参数详细说明
  • 研究下CSS3的background-size属性
  • javascript 实现函数/方法重载效果
  • 研究百度分享自定义URL的BUG

文章分类

.NET技术 123 数据库 24 Web前端 21 网站建设运维 37 操作系统与应用 66 程序猿日常 11 开发工具 12 其他随笔 13

文章标签

ASP.NET ASP.NET MVC C# CSS HTML IIS Javascript Linux MongoDB MySql SQL SQL Server Visual Studio Windows系统 版本控制系统 插件工具 服务器 搞笑娱乐 好文分享 软件应用 生活知识 手机问题 随笔 网络知识 网站设计优化 网站维护 养生保健 异常处理 硬件设备 游戏攻略

热门文章

  • IIS8如何安装和使用URL重写工具-URL Rewrite
  • 林蛋大与楚中天,朱肚皮与朱月坡
  • 解决IE11安装升级失败和在安装前需要更新的问题
  • Windows Server 2012无法安装 .NET3.5-安装角色或功能失败,找不到源文件
  • VS重构重命名的快捷键

推荐文章

  • 连续收到邮件和短信通知需要添加网页底部备案编号链接
  • VS添加命名空间的快捷键
  • ASP.NET 动态设置 HTTP 500 引发内部服务器错误
  • 禁止二级域名被搜索引擎蜘蛛抓取的思路
  • ChinaPay踩坑笔记一:在64位系统中不支持ASP支付功能

友情链接

  • Passingwind的博客
  • 码友网

知识共享许可协议 CC BY-SA 4.0本站作品采用知识共享许可协议:署名-相同方式共享 4.0 国际(CC BY-SA 4.0)。
闽ICP备15003702号
闽公网安备 35020302035102号