js面向对象编程之如何实现方法重载


Posted in Javascript onJuly 02, 2014

js中如何实现方法重载?这涉及到三个问题

1.同名函数的调用问题

2.函数中特殊的参数arguments

3.如何利用arguments实现方法重载

1、同名函数的调用问题

都知道在js中如果存在多个名称相同的函数,则调用实际每次都只使用最后一个,js其实是没有重载的,也就是说,如果定义了多个同名的函数,单参数不一样,在调用时,js不管参数个数,只管前后顺序

例如:

function test1(arg1) 
{ 
alert("参数1:"+arg1); 
} 
function test1(arg1,arg2,arg3) 
{ 
alert("参数1:"+arg1+"参数2:"+arg2+"参数3:"+arg3); 

} 
//测试代码 
function test(){ 
test1("1") 
}

 虽然我们调用的是test1("1"),传递了一个参数,但实际调用的却是test1(arg1,arg2,arg3),并没有因为我们传递了一个参数,而调用只有一个参数的方法。

2、函数中特殊的参数arguments

如果我们使用如下的代码

function test1(arg1,arg2,arg3) 
{ 
alert("参数1:"+arg1+"参数2:"+arg2+"参数3:"+arg3); 

} 
function test1(arg1) 
{ 
alert("参数1:"+arg1); 
} 
//测试代码 
function test(){ 
test1("1","2") 
}

我们知道调用的始终是test1(arg1),也就是只有一个参数的函数,但如何获取传递的其他参数呢?

这就要用到函数中特殊的参数arguments,arguments包含了所有传递给函数的参数

function test1() 
{ 
var text=""; 
for(var i=0;i<arguments.length;i++){ 
text+="参数"+i+":"+arguments[i]; 
} 
alert(text); 
} 
//测试代码 
function test(){ 
test1("1"); 
test1("1","2"); 
test1("1","2","3"); 
}

经过测试发现,arguments包含了传递给函数的所有参数,并且arguments.length根据实际传递参数的个数的不同而不同,arguments.length代表了实际传递给函数参数的个数。

3、如何在js中实现函数的重载?

经过以上的测试发现,在js中不能直接实现函数的重载,但有没有办法实现类似重载效果的方法呢?

可以,主要就是利用arguments

例如:

function test1() 
{ 
var text=""; 
if(arguments.length==1) 
{ 
//调用一个参数的方法 
} 
else if(arguments.length==2) 
{ 
//调用两个参数的方法 
} 
else { //其他的方法 
} 
}
Javascript 相关文章推荐
javascript 计算两个整数的百分比值
Dec 26 Javascript
Javascript设计模式之装饰者模式详解篇
Jan 17 Javascript
Vue表单验证插件的制作过程
Apr 01 Javascript
在iframe中使bootstrap的模态框在父页面弹出问题
Aug 07 Javascript
jQuery实现DIV响应鼠标滑过由下向上展开效果示例【测试可用】
Apr 26 jQuery
vue axios 给生产环境和发布环境配置不同的接口地址(推荐)
May 08 Javascript
js拖动滑块和点击水波纹效果实例代码
Oct 16 Javascript
electron中使用bootstrap的示例代码
Nov 06 Javascript
vue webpack打包后图片路径错误的完美解决方法
Dec 07 Javascript
在vue中使用setInterval的方法示例
Apr 16 Javascript
node.js处理前端提交的GET请求
Aug 30 Javascript
vue cli 3.0通用打包配置代码,不分一二级目录
Sep 02 Javascript
jquery.validate.js插件使用经验记录
Jul 02 #Javascript
escape编码与unescape解码汉字出现乱码的解决方法
Jul 02 #Javascript
js获取IP地址的方法小结
Jul 01 #Javascript
jQuery截取指定长度字符串的实现原理及代码
Jul 01 #Javascript
原生js事件的添加和删除的封装
Jul 01 #Javascript
jQuery的:parent选择器定义和用法
Jul 01 #Javascript
jQuery 写的简单打字游戏可以提示正确和错误的次数
Jul 01 #Javascript
You might like
第十一节 重载 [11]
2006/10/09 PHP
php创建桌面快捷方式实现方法
2015/12/31 PHP
PHP递归算法的简单实例
2019/02/28 PHP
tp5修改(实现即点即改)
2019/10/18 PHP
【消息提示组件】,兼容IE6/7&amp;&amp;FF2
2007/09/04 Javascript
Javascript匿名函数的一种应用 代码封装
2010/06/27 Javascript
js 火狐下取本地路径实现思路
2013/04/02 Javascript
ExtJS的拖拽效果示例
2013/12/09 Javascript
Javascript基础教程之if条件语句
2015/01/18 Javascript
jQuery实现的多屏图像图层切换效果实例
2015/05/07 Javascript
js仿拉勾网首页穿墙广告效果
2017/03/08 Javascript
原生JS京东轮播图代码
2017/03/22 Javascript
switchery按钮的使用方法
2017/12/18 Javascript
vue2.0实现音乐/视频播放进度条组件
2018/06/06 Javascript
jQuery实现基本隐藏与显示效果的方法详解
2018/09/05 jQuery
Net微信网页开发 使用微信JS-SDK获取当前地理位置过程详解
2019/08/26 Javascript
javascript 对象 与 prototype 原型用法实例分析
2019/11/11 Javascript
JavaScript对象原型链原理解析
2020/01/22 Javascript
bootstrap-paginator服务器端分页使用方法详解
2020/02/13 Javascript
理解JavaScript中的Proxy 与 Reflection API
2020/09/21 Javascript
[54:05]DOTA2-DPC中国联赛定级赛 SAG vs iG BO3第一场 1月9日
2021/03/11 DOTA
浅析Python中的join()方法的使用
2015/05/19 Python
python开启debug模式的方法
2019/06/27 Python
Python Pandas数据结构简单介绍
2019/07/03 Python
Django查询优化及ajax编码格式原理解析
2020/03/25 Python
常用的四种CSS透明属性介绍
2014/04/12 HTML / CSS
在HTML5 canvas里用卷积核进行图像处理的方法
2018/05/02 HTML / CSS
美国知名的网上鞋类及相关服装零售商:Shoes.com
2017/05/06 全球购物
房产公证书
2015/01/23 职场文书
邀请书格式范文
2015/02/02 职场文书
中标通知书范本
2015/04/17 职场文书
浅谈JS的二进制家族
2021/05/09 Javascript
Python使用openpyxl批量处理数据
2021/06/23 Python
解决SpringBoot跨域的三种方式
2021/06/26 Java/Android
解决xampp安装后Apache无法启动
2022/03/21 Servers
浅谈MySQL中的六种日志
2022/03/23 MySQL