js中方法重载如何实现?以及函数的参数问题


Posted in Javascript onAugust 01, 2013

都知道在js中没有办法直接实现方法重载,因为在js中如果定义了多个名称相同,但参数个数不一样的方法,其实只有最后一个方法能被真正调用,其他的方法都被覆盖掉了。

但每一个函数都有一个特殊的参数arguments,利用它可以实现方法的重载。

例如:

function Add(firstnumber,sencondnumber) { 
return firstnumber+sencondnumber; 
}

只能处理两个参数,如果有多个参数,或者没有参数,一个参数的情况都是处理不了的。如果没有传递参数,则firstnumber,sencondnumber都是未定义的,如果传递了一个参数,就相当于只给firstnumber赋值了,sencondnumber依然是未定义。相反如果传递了多于两个的参数,则相当于firstnumber,sencondnumber都赋值了,虽然还有其他的参数,但处理时都忽略掉了。如果能获取其他的参数,自然就可以处理了。此时应该就可以想到函数的特殊参数arguments,这个包含了传递给函数的所有参数,利用它就可以实现方法重载的效果。

以上的方法修改如下:

function Add(firstnumber,sencondnumber) { 
if (arguments.length == 0)//没有传递参数 
{ 
return null; 
} 
else if (arguments.length == 1) {//传递的是一个参数 
return firstnumber;//也可以写为 return arguments[0]; 
} 
else if(arguments.length == 2)//传递的是两个参数 
{ return firstnumber+sencondnumber;//也可以写为 return arguments[0]+arguments[1]; 
} 
else { 
var total=0; 
for (var i = 0; i < arguments.length; i++) { 
total=total+arguments[i] 
} 
return total; 
} 
}

当然这种方法的弊端就是参数的顺序不能打乱,如果函数实现依赖于参数的顺序,就必须进行特殊处理,例如传递null来占位。

由于传递给函数的参数是严格按照定义函数的顺序给每一个参数赋值的,如果只想给第二个参数赋值,则必须传递两个参数,否则实际上传递的值赋值给了第一个参数,并没有赋值给第二个参数。

例如只想给sencondnumber传值,但不想给firstnumber传值,必须这样调用Add(null,2)(当然函数内部必须处理传递特殊值的情况),如果这样调用Add(2),其实是给firstnumber传值了,相当于调用了传递了一个参数的情况。

Javascript 相关文章推荐
Javascript的IE和Firefox兼容性汇编(zz)
Feb 02 Javascript
js图片闪动特效可以控制间隔时间如几分钟闪动一下
Aug 12 Javascript
laytpl 精致巧妙的JavaScript模板引擎
Aug 29 Javascript
JavaScript中实现继承的三种方式和实例
Jan 29 Javascript
基于jquery css3实现点击动画弹出表单源码特效
Aug 31 Javascript
TypeScript入门-基本数据类型
Mar 28 Javascript
微信小程序实践之动态控制组件的显示/隐藏功能
Jul 18 Javascript
对angular2中的ngfor和ngif指令嵌套实例讲解
Sep 12 Javascript
详解JS取出两个数组中的不同或相同元素
Mar 20 Javascript
vue element 生成无线级左侧菜单的实现代码
Aug 21 Javascript
react实现同页面三级跳转路由布局
Sep 26 Javascript
jQuery实现可以扩展的日历
Dec 01 jQuery
子窗体与父窗体传值示例js代码
Aug 01 #Javascript
根据选择不同的下拉值出现相对应的文本输入框
Aug 01 #Javascript
jquery图片放大功能简单实现
Aug 01 #Javascript
基于jquery的文章中所有图片width大小批量设置方法
Aug 01 #Javascript
Jquery动态更改一张位图的src与Attr的使用
Jul 31 #Javascript
jquery中选择块并改变属性值的方法
Jul 31 #Javascript
JQuery写动态树示例代码
Jul 31 #Javascript
You might like
PHP4中实现动态代理
2006/10/09 PHP
解析php中const与define的应用区别
2013/06/18 PHP
三种php连接access数据库方法
2013/11/11 PHP
php使用类继承解决代码重复的问题
2015/02/11 PHP
PHP导出Excel实例讲解
2016/01/24 PHP
php 的反射详解及示例代码
2016/08/25 PHP
解析PHP之提取多维数组指定列的方法
2017/01/03 PHP
input 输入框内的输入事件详细分析
2010/03/17 Javascript
JQuery.Ajax之错误调试帮助信息介绍
2013/07/04 Javascript
原生js操作checkbox用document.getElementById实现
2013/10/12 Javascript
jQuery 仿百度输入标签插件附效果图
2014/07/04 Javascript
JQuery 实现在同一页面锚点链接之间的平滑滚动
2014/10/29 Javascript
基于jQuery实现点击最后一行实现行自增效果的表格
2016/01/12 Javascript
JS实现页面跳转参数不丢失的方法
2016/11/28 Javascript
vue.js使用v-model指令实现的数据双向绑定功能示例
2018/05/22 Javascript
vue如何进行动画的封装
2018/09/26 Javascript
Vue.js上传图片到阿里云OSS存储的方法示例
2018/12/13 Javascript
JavaScript函数式编程(Functional Programming)高阶函数(Higher order functions)用法分析
2019/05/22 Javascript
微信小程序 多行文本显示...+显示更多按钮和收起更多按钮功能
2019/09/26 Javascript
vue更改数组中的值实例代码详解
2020/02/07 Javascript
Vue项目打包压缩的实现(让页面更快响应)
2020/03/10 Javascript
jQuery实现开关灯效果
2020/08/02 jQuery
vue实现两个区域滚动条同步滚动
2020/12/13 Vue.js
Python实现的tab文件操作类分享
2014/11/20 Python
对Python 语音识别框架详解
2018/12/24 Python
python 处理数字,把大于上限的数字置零实现方法
2019/01/28 Python
python2和python3哪个使用率高
2020/06/23 Python
美国购买体育、音乐会和剧院门票网站:SelectATicket
2019/09/08 全球购物
给导游的表扬信
2014/01/10 职场文书
《观舞记》教学反思
2014/04/16 职场文书
2014组织生活会方案
2014/05/19 职场文书
超市促销活动总结
2014/07/01 职场文书
2015年宣传部部长竞选演讲稿
2014/11/28 职场文书
丧事答谢词大全
2015/09/30 职场文书
浅析CSS在DevTools 中架构演变
2021/10/05 HTML / CSS
python语言中pandas字符串分割str.split()函数
2022/08/05 Python