妙用缓存调用链实现JS方法的重载
来自于我的博客http://sweets.cf/,转载注明出处
1.什么是方法重载
方法重载是指在一个类中定义多个同名的方法,但要求每个方法具有不同的参数的类型或参数的个数。
简而言之就是:方法重载就是方法名称重复,加载参数不同。
具体看请左转: 方法重载/百度百科
那么js如何实现这个呢???
2. js如何实现?
首先javascript是没有重载函数/方法这个概念的,但是js提供了一个arguments这个方法参数,通过这个参数的length属性就可以拿到方法参数的长度,o对了,咱们今天实现的也仅仅是按照参数长度`重载`,而不是参数类型~·length ,
那么及下载呢,一旦有了方法参数长度,于是出现了比常见的switch写法:
var seven={
dosomething:function(){
switch(arguments.length){
case 0:
console.log(arguments.length);
//dosomething
break;
case 1:
console.log(arguments.length);
//dosomething
break;
case 2:
//dosomething
console.log(arguments.length);
break;
}
}
}
3.优化
wow如果10个方法就需要10个分支而且很不好维护因为每个方法体都在case下,或者单独提出来写成一个function
然后这些都是不好的不易维护的,逼格不够高的那么咱们应该如何优雅的实现对于不同参数的同一方法名的处理呢?
这就用到这个 apply 这个方法了.
咱们为seven编写一个addMethod方法
var seven = {
addMethod: function (fname, func) {
var old = this[fname];
this[fname] = function () {
if (arguments.length == func.length) {
return func.apply(this,arguments);
}
if (typeof old == 'function') {
return old.apply(this, arguments);
}
}
}
};
修改后的seven如上,然后之前写的switch就可以这样搞了:
seven.addMethod('dosomething', function (x) {
console.log(arguments.length);
//dosomething
});
seven.addMethod('dosomething', function (x,y) {
console.log(arguments.length);
//dosomething
});
seven.addMethod('dosomething', function (x,y,z) {
console.log(arguments.length);
//dosomething
});
咱们要增加方法,只需要调用这个addMethod方法就ok了,是不是觉得简单明了,更加清晰。
那么这段代码的原理呢,其实也很简单,就是缓存旧方法,然后根据参数长度依次apply链式调用,直到找到和当前参数等长的方法~然后进行调用。
func 和 old 很有可能让初来乍到的童鞋们迷惑,其实不然,这里巧妙的使用了JavaScript语言的特性,这个old每一次保存的都是上一次方法的引用,
而且每次都是全新的,而旧的old又保持着引用,这是什么呢?闭包喽~。
妙用缓存调用链实现JS方法的重载的更多相关文章
- 安卓端调用h5界面js方法和ios端调用h5界面js方法
备注:本人为h5开发人员,不懂安卓和ios,这是开发小伙伴对接联调的主代码. 1.iOS端调用h5界面js方法: 2.安卓端调用h5界面js方法: @Override protect ...
- thymeleaf的初次使用(带参请求以及调用带参js方法)
之前对于前端框架接触较少,第一次接触thymeleaf,虽说看起来并不复杂但我还是花费了好一会儿才弄懂. 话不多少下面就简单说一下我在项目中的应用. 首先是java代码 controller层 将需要 ...
- 客户端调用web中js方法(C调B)跨域问题
这几天遇到了个棘手问题(c调b),经过排错查出了问题. 一,问题描述如下: 1.客户端需要调用father.html中一个js方法,特殊之处在于 这个father.html中有个iframe嵌套了一个 ...
- JS 在open打开的子窗口页面中调用父窗口页面的JS方法
需求的情景如下: 1:做新增或修改等操作的时候打开一个新的浏览器窗口(使用window.open(参数等)方法) 2:在新增或修改等的页面上有返回按钮.重置按钮.保存按钮,对于返回就直接关闭此窗口(使 ...
- 纯静态界面中(html)中通过js调用dll中的方法从数据库中读取数据
最近接到一个离职员工的任务,一个搭好框架的ERP系统,看了两天,说一下看到的东西,整个项目目录中我没发现一个.aspx后缀的文件,全是静态HTML文件,之后发现他用的jquery简直看的头疼,不过大概 ...
- Zipkin存储Sleuth信息实现调用链追踪的几种方法
版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接:https://blog.csdn.net/alva_xu/article/detail ...
- C#后台程序与HTML页面中JS方法互调(功能类似于Ajax中的DWR)
此方法适用于 C#中嵌入WebBrowser(浏览器) 通过浏览器中加载的页面与C#的后台代码进行交互. 一.C#程序 1.在C#窗体中添加WebBrowser(浏览器),将页面的URL添加到浏览器中 ...
- C#后台程序与HTML页面中JS方法互调
此方法适用于 C#中嵌入WebBrowser(浏览器) 通过浏览器中加载的页面与C#的后台代码进行交互. 一.C#程序 1.在C#窗体中添加WebBrowser(浏览器),将页面的URL添加到浏览器中 ...
- Opentracing + Uber Jaeger 全链路灰度调用链,Nepxion Discovery
当网关和服务在实施全链路分布式灰度发布和路由时候,我们需要一款追踪系统来监控网关和服务走的是哪个灰度组,哪个灰度版本,哪个灰度区域,甚至监控从Http Header头部全程传递的灰度规则和路由策略.这 ...
随机推荐
- Azure PowerShell 1.0.0以上版本在中国Azure使用的注意事项
随着Azure PowerShell 1.0.0+的推出,越来越多的客户开始使用新的版本的Azure PowerShell.此版本的PowerShell最大的改变在于将原先的Switch-AzureM ...
- 【JavaScript学习笔记】点击消失
<!DOCTYPE html> <html> <head> <script type="text/javascript" src=&quo ...
- dede 5.7进后台卡死解决办法
注释后台文件dede/templets/index_body.htm(大概在第18行) <script type="text/javascript"> function ...
- swun 1397 来电显示
解题思路:这题最关键的是要注意当输入的数据,00123,0000等这些情况, 刚开始用long long, WA了好几发,非常迷茫,后来突然想起特殊数据, 用字符串,则轻松解决问题.顺便多说两句:当你 ...
- JRE、JDK和JVM之间的关系
Java学了有两年了,要让详细说说JRE.JDK.JVM,确实不能脱口而出.下面在别人博客的基础上,总结一下. JVM(Java Virtual Machine 即Java虚拟机) 它是整个Java实 ...
- Shell教程6-Shell注释
以“#”开头的行就是注释,会被解释器忽略. sh里没有多行注释,只能每一行加一个#号.只能像这样: #-------------------------------------------- # 这是 ...
- 配置apache以fastcgi运行php
apache默认是用自带的mod_php模块运行php,现在我们介绍使用fastcgi来执行php脚本.先说下fastcgi的优点: Fastcgi的优点: 从稳定性上看, fastcgi是以独立的进 ...
- linux下ubuntu系统安装及开发环境配置
1.安装系统:别的没什么说的,就是安的时候把网线拔了,不然到 configure apt的时候会卡起很久不走的2.配置网络 编辑/etc/network/interface打开/etc/networt ...
- pdm 中怎么修改表的Name值时使Code值不变
修改方法:PowerDesign中的选项菜单里修改,在[Tool]-->[General Options]->[Dialog]->[Operating modes]->[Nam ...
- js与C#服务端 json数据交互
1.1 服务端返回给前端 返回的数据都放入对象中(根据需求:单个对象,集合,键值对),然后JSON序列化返回给前端.这里可以引用JSON.NET 库,也可以用.NET自带的类库: JavaScript ...