JS重载实现方法分析

发布时间 - 2026-01-10 21:53:14    点击率:

本文实例分析了JS重载实现方法。分享给大家供大家参考,具体如下:

重载是面向对象语言里很重要的一个特性,JS中没有真正的重载,是模拟出来的(因为js是基于对象的编程语言,不是纯面向对象的,它没有真正的多态:如继承、重载、重写)

一、什么时候用重载?

举例:

function getDataTop10(){
  alert("返回前10条数据");
}

后来需求改了,需要获得20条数据,而getDataTop10又被很多函数调用了,整体替换可以但麻烦,这时可以用重载

进而引出什么是重载:函数名相同,但是可以区分出来,想用哪个就用哪个,而不是后面的同名函数覆盖前面的

二、怎么用?

arguments:Js里的一个内置对象,包含了调用者传递的实际参数(函数声明时定义的参数个数不影响)

function getData(){
  alert("返回所有数据");
}
function getDataTop(num){
  alert("返回前"+num+"数据");
}
function getDataLimit(num1,num2){
  alert("返回前"+num1+"-"+num2+"数据");
}
function getDste(){
  var num=arguments.length;
  if(!num){
  getData();
  }
  else if(num==1){
  getDataTop(arguments[0]);
  }
  else if(num==2){
  getDataLimit(arguments[0],arguments[1]);
  }
}
getDste(5)

当参数很多时要写一大串,遂可以改进

function getData(){
  alert("返回所有数据");
}
function getDataTop(num){
  alert("返回前"+num+"数据");
}
function getDataLimit(num1,num2){
  alert("返回前"+num1+"-"+num2+"数据");
}
function getDste(){
  var num=arguments.length;
  if(!num){
    getData();
  }
  else if(num==1){
    getDataTop.apply(this,arguments);
  }
  else if(num==2){
    getDataLimit.apply(this,arguments);
  }
}
getDste(5)

如果参数个数相同,类型不同,又该如何

function getData(){
  alert("返回所有数据");
}
function getDataTop(num){
  alert("返回前"+num+"数据");
}
function getDataLimit(num1,num2){
  alert("返回前"+num1+"-"+num2+"数据");
}
function getDataByType(type){
  alert("将返回"+type+"类型的数据");
}
function getDste(){
  var num=arguments.length;
  if(!num){
  getData();
  }
  else if(num==1){
  if(typeof arguments[0]=="number"){
      getDataTop.apply(this,arguments);
  }
  else{
    getDataByType.apply(this,arguments);
  }
  }
  else if(num==2){
  getDataLimit.apply(this,arguments);
  }
}
getDste("array")

三、好处

有利于合作开发

四、坏处

“实现”太勉强,如果参数过多,就要很多if语句,显得代码很乱

更多关于JavaScript相关内容可查看本站专题:《javascript面向对象入门教程》、《JavaScript中json操作技巧总结》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。


# JS  # 重载  # JS模拟实现方法重载示例  # JavaScript中的方法重载实例  # javascript中通过arguments参数伪装方法重载  # js面向对象编程之如何实现方法重载  # js中方法重载如何实现?以及函数的参数问题  # 有关于JS构造函数的重载和工厂方法  # 添加JavaScript重载函数的辅助方法2  # 为JavaScript添加重载函数的辅助方法  # JavaScript 的方法重载效果  # 妙用缓存调用链实现JS方法的重载  # 面向对象  # 相关内容  # 什么时候  # 可以用  # 遍历  # 一大  # 数据结构  # 给大家  # 很重要  # 重写  # 就用  # 更多关于  # 时要  # 改了  # 想用  # 所述  # 程序设计  # 编程语言  # 又该  # 而不是 


相关栏目: 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571


相关推荐: 公司门户网站制作流程,华为官网怎么做?  Laravel怎么创建自己的包(Package)_Laravel扩展包开发入门到发布  安克发布新款氮化镓充电宝:体积缩小 30%,支持 200W 输出  三星网站视频制作教程下载,三星w23网页如何全屏?  JavaScript如何实现错误处理_try...catch如何捕获异常?  如何在服务器上三步完成建站并提升流量?  如何注册花生壳免费域名并搭建个人网站?  谷歌浏览器如何更改浏览器主题 Google Chrome主题设置教程  Android Socket接口实现即时通讯实例代码  ,南京靠谱的征婚网站?  Win11怎么设置虚拟桌面 Win11新建多桌面切换操作【技巧】  UC浏览器如何设置启动页 UC浏览器启动页设置方法  Laravel如何处理JSON字段_Eloquent原生JSON字段类型操作教程  javascript读取文本节点方法小结  Laravel如何为API编写文档_Laravel API文档生成与维护方法  Midjourney怎么调整光影效果_Midjourney光影调整方法【指南】  Laravel怎么实现模型属性转换Casting_Laravel自动将JSON字段转为数组【技巧】  Laravel怎么配置自定义表前缀_Laravel数据库迁移与Eloquent表名映射【步骤】  轻松掌握MySQL函数中的last_insert_id()  如何在建站之星网店版论坛获取技术支持?  中国移动官方网站首页入口 中国移动官网网页登录  Android 常见的图片加载框架详细介绍  如何用JavaScript实现文本编辑器_光标和选区怎么处理  Windows11怎样设置电源计划_Windows11电源计划调整攻略【指南】  北京的网站制作公司有哪些,哪个视频网站最好?  HTML 中动态设置元素 name 属性的正确语法详解  Laravel如何自定义错误页面(404, 500)?(代码示例)  JS碰撞运动实现方法详解  如何使用 Go 正则表达式精准提取括号内首个纯字母标识符(忽略数字与嵌套)  再谈Python中的字符串与字符编码(推荐)  Laravel全局作用域是什么_Laravel Eloquent Global Scopes应用指南  如何在IIS中新建站点并配置端口与物理路径?  如何在建站主机中优化服务器配置?  EditPlus 正则表达式 实战(3)  详解免费开源的DotNet二维码操作组件ThoughtWorks.QRCode(.NET组件介绍之四)  如何快速上传自定义模板至建站之星?  Laravel Eloquent访问器与修改器是什么_Laravel Accessors & Mutators数据处理技巧  如何在IIS服务器上快速部署高效网站?  Laravel观察者模式如何使用_Laravel Model Observer配置  千问怎样用提示词获取健康建议_千问健康类提示词注意事项【指南】  Laravel N+1查询问题如何解决_Eloquent预加载(Eager Loading)优化数据库查询  如何用AI帮你把自己的生活经历写成一个有趣的故事?  Android GridView 滑动条设置一直显示状态(推荐)  如何正确下载安装西数主机建站助手?  如何在阿里云完成域名注册与建站?  javascript如何操作浏览器历史记录_怎样实现无刷新导航  夸克浏览器网页跳转延迟怎么办 夸克浏览器跳转优化  如何用西部建站助手快速创建专业网站?  Angular 表单中正确绑定输入值以确保提交与验证正常工作  Laravel中的withCount方法怎么高效统计关联模型数量