美文网首页
js的重载

js的重载

作者: 小码农_影 | 来源:发表于2022-03-13 20:58 被阅读0次

问:什么是重载?
答:同样的函数,不同样的参数个数。
《JS高级程序设计》里是提到过函数是没有重载的,ts中有重载。但是可以根据arguments的长度来实现重载。

//js的重载
function fn (name){
  console.log(name)
};
function fn(name,age){
  console.log(name,age);
}  ;
function fn (name,age,sex){
  console.log(name,age,sex);
};
fn('ying');
fn('ying',18);
fn('ying',18,女);
// 理想结果:
// 'ying'
// 'ying',18
//  'ying',18,女

//实际结果
// 'ying',undefined,undefined,
// 'ying',18,undefined
//  'ying',18,女

最后定义的fn将前两个fn覆盖掉,所以没有达到重载的效果

想达到一个理想的效果也还是有办法的,就是定义一个fn,然后判断arguments的长度判断,然后分别执行不同的语句。

function fn(){
  switch(arguments.length){
    case 1:
        var [name] = arguments;
        console.log(name);
    case 2:
        var [name,age] = arguments;
        console.log(name,age);
    case 3:
        var [name,age,sex] = arguments;
        console.log(name,age,sex);
        break;
  }
}
//实现效果
// 'ying'
// 'ying',18
//  'ying',18,女

虽然上述达到了想要的效果,但不是完美的实现js的重载。
高端实现js的重载做法是利用闭包。

这个方法在JQuery之父John Resig写的《secrets of the JavaScript ninja》中,这种方法充分的利用了闭包的特性!
function addMethods(object,name,fn){
  let old = object[name];//把初始传入的方法存在一个临时变量old中,
  object[name] = function (){//重写传入的方法,
      if(fn.length === arguments.length){// 如果调用object[name]时,如果传入的参数与预期的一致,则直接调用。
         fn.apply(this,arguments);
      }else if(typeof fn === 'function'){// 否则判断old是否为函数,如果是,就调用
        old.apply(this,arguments); 
      }
  }
}
addMethods(window,'fn',(name)=>{console.log(name)});
addMethods(window,'fn',(name,age)=>{console.log(name,age)});
addMethods(window,'fn',(name,age,sex)=>{console.log(name,age,sex)});
// 结果:
// 'ying'
// 'ying',18
//  'ying',18,女

参考资料:https://www.cnblogs.com/yugege/p/5539020.html

相关文章

  • 2019-08-27

    Javascript的多态性 1.js不支持重载 /*****************说明js不支持重载*****...

  • JS知识点整理-3

    JS函数的重载 什么是重载? 方法名相同,参数不同 JS是否存在重载?--不存在,调用最后一个方法,把传递的参数保...

  • js的重载

    javascript中书上的介绍说是没有重载的,实际上利用闭包是可以用重载的。 添加find的方法的重载。 add...

  • js的重载

    问:什么是重载?答:同样的函数,不同样的参数个数。《JS高级程序设计》里是提到过函数是没有重载的,ts中有重载。但...

  • 2.解决js中没有函数重载问题

    在js中没有重载: 相同名称的函数,最后一次声明的函数会覆盖之前声明的函数 解决js中没有重载的问题: 1.解决参...

  • js 函数的重载

    我们知道,很多编程语言都有函数的重载。 所谓的重载,看定义: 重载,简单说,就是函数或者方法有相同的名称,但是参数...

  • js没有重载

    重载函数 同名不同参数(类型和数量)的函数之间互称为重载函数。 理解参数 js中的参数不同于传统的编程语言中的参数...

  • js函数重载

  • JS函数重载

    所谓函数重载(method overloading),就是函数名称一样,但是输入输出不一样。或者说,允许某个函数有...

  • 【jq源码探秘】— js如何实现实现重载

    大家都知道js是没有重载的,但是通过某种方式是可以实现的,下面就是jq的实现方式: 凭直觉,函数重载可以通过if…...

网友评论

      本文标题:js的重载

      本文链接:https://www.haomeiwen.com/subject/lrjddrtx.html