javascript函数重载解决方案分享


Posted in Javascript onFebruary 19, 2014

JS的函数定义可以指定形式参数名称,多多少少我们会以为js至少可以支持参数个数不同的方法重载,然而遗憾的是这仅仅是一个假象,js所有的参数都是以arguments传递过去的,这个参数类似于数组,在函数调用的时候,所有的实参都是保存在了这个数据结构里面,我们定义函数的时候所指定的形式参数其实是为这个数据结构里面的数据定义一个快捷的访问方式。也就是说js所有的函数都是支持无限个参数的,加上数据类型是弱类型,那么JS的函数除了名称就真的没有方法区别了?

办法总是有的,我们可以利用JavaScript中的特殊对象arguments来模拟函数重载。用它来判断传入参数的个数或类型以区分重载。

1.根据参数个数重载

js判断传入参数数量可以用arguments.length这个属性来判断;

<script type="text/javascript">
function add() {
    if (arguments.length == 1) {
        alert(arguments[0] + 10);
    }
    else if (arguments.length == 2) {
        alert(arguments[0] + arguments[1]);
    }
}
//函数调用
add(10);
add(10, 20);
</script>

2.根据参数类型重载

判断变量类型的3种方法:
1.用 typeof 语句判断变量类型,typeof语句返回类型对应的字符串。
2.用 instanceof 语句判断变量类型,instanceof语句返回true/false。
3.用 constructor 属性判断变量类型,这个属性返回用来构造该变量的构造函数引用。
对照表:可以看出用 typeof 不能准确的判断出具体的类型,所以我们用 constructor 来进行判断。

typeof string number object function boolean object object
constructor String Number Object Function Boolean Array User Define
<script type="text/javascript">
function add() 
{
    if (arguments.length == 0) return 0;
    var sum=0;
    for(var i=0; i<arguments.length; i++){
        if(arguments[i].constructor == Number){
        //或者改为:if(arguments[i] instanceof Number)
        //或者改为:if(typeof(arguments[i])=="number")
        sum += arguments[i];
      }
    }
    return sum;
}
//函数调用
alert(add(10));
alert(add(10,20));
</script>
Javascript 相关文章推荐
Javascript Object.extend
May 18 Javascript
js和jquery批量绑定事件传参数一(新猪猪原创)
Jun 23 Javascript
js 编码转换 gb2312 和 utf8 互转的2种方法
Aug 07 Javascript
一个jquery实现的不错的多行文字图片滚动效果
Sep 28 Javascript
jQuery实现ichat在线客服插件
Dec 29 Javascript
js原生实现FastClick事件的实例
Nov 20 Javascript
基于jQuery实现数字滚动效果
Jan 16 Javascript
node.js实现微信JS-API封装接口的示例代码
Sep 06 Javascript
彻底弄懂 JavaScript 执行机制
Oct 23 Javascript
微信小程序返回箭头跳转到指定页面实例解析
Oct 08 Javascript
vue+ESLint 配置保存 自动格式化代码
Mar 17 Javascript
如何使用 vue-cli 创建模板项目
Nov 19 Vue.js
一个CSS+jQuery实现的放大缩小动画效果
Feb 19 #Javascript
使用CSS样式position:fixed水平滚动的方法
Feb 19 #Javascript
jQuery拖拽div实现思路
Feb 19 #Javascript
JQuery异步加载无限下拉框级联功能实现示例
Feb 19 #Javascript
调用DOM对象的focus使文本框获得焦点
Feb 19 #Javascript
让jQuery Mobile不显示讨厌loading界面的方法
Feb 19 #Javascript
javascript动态向网页中添加表格实现代码
Feb 19 #Javascript
You might like
一首老MP3,致敬WAR3经典
2021/03/08 魔兽争霸
vBulletin HACK----显示话题大小和打开新窗口于论坛索引页
2006/10/09 PHP
探讨php中防止SQL注入最好的方法是什么
2013/06/10 PHP
php实现单笔转账到支付宝功能
2018/10/09 PHP
在Ubuntu 18.04上安装PHP 7.3 7.2和7.0的方法
2019/04/09 PHP
Yii框架操作cookie与session的方法实例详解
2019/09/04 PHP
JS表的模拟方法
2015/02/05 Javascript
js实现一个链接打开两个链接地址的方法
2015/05/12 Javascript
jQuery超精致图片轮播幻灯片特效代码分享
2015/09/10 Javascript
Function.prototype.apply()与Function.prototype.call()小结
2016/04/27 Javascript
js ajaxfileupload.js上传报错的解决方法
2016/05/05 Javascript
Node.js 中exports 和 module.exports 的区别
2017/03/14 Javascript
Bootstrap组件之下拉菜单,多级菜单及按钮布局方法实例
2017/05/25 Javascript
使用JS实现气泡跟随鼠标移动的动画效果
2017/09/16 Javascript
js 使用ajax设置和获取自定义header信息的方法小结
2020/03/12 Javascript
对python使用http、https代理的实例讲解
2018/05/07 Python
Sanic框架基于类的视图用法示例
2018/07/18 Python
Tensorflow分类器项目自定义数据读入的实现
2019/02/05 Python
PyQt5的安装配置过程,将ui文件转为py文件后显示窗口的实例
2019/06/19 Python
python 如何将数据写入本地txt文本文件的实现方法
2019/09/11 Python
利用python控制Autocad:pyautocad方式
2020/06/01 Python
openCV提取图像中的矩形区域
2020/07/21 Python
详解WebSocket跨域问题解决
2018/08/06 HTML / CSS
俄罗斯旅游网站:Tripadvisor俄罗斯
2017/03/21 全球购物
adidas菲律宾官网:adidas PH
2020/02/07 全球购物
介绍一下JMS编程步骤
2015/09/22 面试题
家具厂厂长岗位职责
2014/01/01 职场文书
公司年会演讲稿范文
2014/01/11 职场文书
咖啡书吧创业计划书
2014/01/13 职场文书
租房协议书
2014/04/10 职场文书
高中生班主任评语
2014/04/25 职场文书
高中班主任评语大全
2014/04/25 职场文书
政府信息公开实施方案
2014/05/09 职场文书
解除劳动关系协议书2篇
2014/11/28 职场文书
2015年社区综治工作总结
2015/04/21 职场文书
Jsonp劫持学习
2021/04/01 PHP