详解JS函数重载
更新时间：2014年12月04日 10:03:14 投稿：hebedich
本文主要介绍了利用JavaScript中的特殊对象arguments来模拟函数重载的解决方案，非常的实用，给需要的小伙伴参考下
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函数重载的方法了呢，有疑问就留言吧
相关文章
MVVM 是 Web 前端一种非常流行的开发模式，利用 MVVM 可以使我们的代码更专注于处理业务逻辑而不是去关心DOM 操作。接下来通过本文给大家介绍JavaScript使用数据绑定实现一个简单的 MVVM 库，感兴趣的朋友一起学习吧2016-04-04
本篇文章主要介绍了ajax接收后台数据在html页面显示的方法，具有很好的参考价值，下面跟着小编一起来看下吧2017-02-02
这是一个带变形动画特效的下拉导航菜单特效。该导航菜单在菜单项之间切换时，下拉菜单会快速的根据菜单内容的大小来动态变形，显示合适的下拉菜单大小，效果非常棒，对导航下拉菜单效果感兴趣的朋友一起通过本文学习吧2016-10-10
这篇文章主要给大家介绍了关于JavaScript中异步/等待的用法与理解，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-11-11
这篇文章主要介绍了JavaScript类的继承操作,结合实例形式总结分析了JavaScript面向对象程序设计中类的继承常见实现方式与操作技巧,需要的朋友可以参考下2018-12-12
这篇文章主要介绍了微信小程序整个页面的自动适应布局的实现，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-07-07
这篇文章主要介绍了JS实现动态生成html table表格的方法,结合实例形式分析了javascript针对数组数据的读取、遍历以及动态生成相关操作技巧,需要的朋友可以参考下2018-07-07
这篇文章主要为大家详细介绍了如何使用JavaScript实现判断时间间隔是否连续为一天,文中的示例代码讲解详细,感兴趣的小伙伴可以了解一下2024-01-01
这篇文章主要介绍了JavaScript中的无阻塞加载性能优化方案,本文讲解了Deferred Scripts 延期脚本、Dynamic Script Elements 动态脚本元素、XMLHttpRequest Script Injection XHR脚本注入等内容,需要的朋友可以参考下2014-10-10
这篇文章主要介绍了echarts大屏字体自适应的方法步骤，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-07-07
最新评论