如何实现JS函数的重载
更新时间：2006年09月22日 00:00:00 作者：
javascript不能支持函数的重载，如下：
<script language="JavaScript">
function f(length)
{
alert("高为："+length);
}
function f(length,width)
{
alert("高为："+length+"，宽为："+width);
}
</srcipt>
上面那段代码其实是行不通的，因为函数定义时的参数个数和函数调用时的参数个数没有任何关系。 在函数中可以用f.arguments[0]和f.arguments[1]得到调用时传入的第一和第二个参数，所以定义function(length)，后面用f(10,10)调用是没有问题的。所以在上面这段代码中，第二个函数是永远不可能被调用到的，那么，要怎样才能实现像函数重载那样的功能呢？
那就是在函数定义中用f.arguments.length判断一下调用时传入的参数个数。然后对不同的情况采用不同的处理方式。
如下：
<script language="JavaScript">
function f()
{
var len= arguments.length;
if(1 == len)
{
var length = arguments[0];
var width = arguments[1];
f2(length,width);
}
else
{
var length = arguments[0];
f1(length);
}
}
function f1(length)
{
alert("高为："+length);
}
function f2(length,width)
{
alert("高为："+length+"，宽为："+width);
}
</srcipt>
这样，你就可以给函数f()传入一个参数也可以传入两个参数了，比如f(10)和f(10,10)；
个人觉得，这样虽然可以实现重载，但也不是很好用，我们可以根据具体情况在一个函数中实现重载，如果要重载的两个函数相差较大，那就保留两个函数，而如果两个函数的实现基本差不多，那么可以在一个函数中进行判断，处理不同的部分，而不需要像上面那样写成三个函数，如下：
<script language="JavaScript">
function f(length)
{
var len= arguments.length;
if(1 == len)
{
var width = arguments[1];
alert("高为："+length+"，宽为："+width);
}
else
{
alert("高为："+length);
}
}
</srcipt>
复制代码 代码如下:
<script language="JavaScript">
function f(length)
{
alert("高为："+length);
}
function f(length,width)
{
alert("高为："+length+"，宽为："+width);
}
</srcipt>
上面那段代码其实是行不通的，因为函数定义时的参数个数和函数调用时的参数个数没有任何关系。 在函数中可以用f.arguments[0]和f.arguments[1]得到调用时传入的第一和第二个参数，所以定义function(length)，后面用f(10,10)调用是没有问题的。所以在上面这段代码中，第二个函数是永远不可能被调用到的，那么，要怎样才能实现像函数重载那样的功能呢？
那就是在函数定义中用f.arguments.length判断一下调用时传入的参数个数。然后对不同的情况采用不同的处理方式。
如下：
复制代码 代码如下:
<script language="JavaScript">
function f()
{
var len= arguments.length;
if(1 == len)
{
var length = arguments[0];
var width = arguments[1];
f2(length,width);
}
else
{
var length = arguments[0];
f1(length);
}
}
function f1(length)
{
alert("高为："+length);
}
function f2(length,width)
{
alert("高为："+length+"，宽为："+width);
}
</srcipt>
这样，你就可以给函数f()传入一个参数也可以传入两个参数了，比如f(10)和f(10,10)；
个人觉得，这样虽然可以实现重载，但也不是很好用，我们可以根据具体情况在一个函数中实现重载，如果要重载的两个函数相差较大，那就保留两个函数，而如果两个函数的实现基本差不多，那么可以在一个函数中进行判断，处理不同的部分，而不需要像上面那样写成三个函数，如下：
复制代码 代码如下:
<script language="JavaScript">
function f(length)
{
var len= arguments.length;
if(1 == len)
{
var width = arguments[1];
alert("高为："+length+"，宽为："+width);
}
else
{
alert("高为："+length);
}
}
</srcipt>
相关文章
这篇文章主要为大家详细介绍了JavaScript实现页面无缝滚动效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-04-04
这篇文章主要为大家详细介绍了微信小程序实现手势滑动卡片效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2019-08-08
uni.getLocation和wx.getLocation方法调用无效也不返回失败的解决方案
这篇文章主要给大家介绍了关于uni.getLocation和wx.getLocation方法调用无效也不返回失败的解决方案,文中通过实例代码以及图文介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2023-04-04
这篇文章主要为大家详细介绍了原生JS实现滑动按钮效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-11-11
bootstrap时间控件daterangepicker使用方法及各种小bug修复
这篇文章主要介绍了bootstrap时间控件daterangepicker使用方法，及各种小bug修复，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-10-10
本文主要是给大家带来一个时间轴的组件开发教程，其主要功能就是可以拖动时间轴来定位当前时间，可以通过鼠标滚轮来修改当前时间分辨率，需要的可以参考一下2022-10-10
这篇文章主要介绍了JavaScript解析任意形式的json树型结构展示的相关资料,需要的朋友可以参考下2017-07-07
Js中parentNode,parentElement,childNodes,children之间的区别
这篇文章主要是对Js中parentNode,parentElement,childNodes,children的区别进行了详细的分析介绍，需要的朋友可以过来参考下，希望对大家有所帮助2013-11-11
在使用bootstrap table的复选框功能的时候，由于采用服务端分页，当在第一页选择了某些数据，然后点击第二页选择一些数据，再次点回第一页，发现原先选择的数据已经清空了，原来的多选框并不支持翻页保留多选数据，怎么解决呢，下面小编给大家分享下解决思路2017-03-03
这篇文章主要为大家详细介绍了微信小程序自定义弹框效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-07-07
最新评论