js实现函数重载

什么！用js实现一个函数重载？而且不能用ts。 什么！js不是不支持函数重载吗？

先聊聊什么是函数重载

用c++写就很简单了：

#include <iostream>
using namespace std;
class printData
{
   public:
      void print(int i) {
        cout << "整数为: " << i << endl;
      }
      void print(double  f) {
        cout << "浮点数为: " << f << endl;
      }
      void print(char c[]) {
        cout << "字符串为: " << c << endl;
      }
};
int main(void)
{
   printData pd;
   pd.print(5); // 输出整数
   pd.print(500.263); // 输出浮点数
   pd.print("Hello C++"); // 输出字符串
}

也就是同个方法名可以实现不同的操作。 预期用同一个函数，在实参不同的情况下实现不同的输出结果，js本身是不支持重载的，后面的函数变量会覆盖前面的函数变量，也就是不管怎么调用，都只会调用最后一次函数变量

那有人问了，直接定义不同的函数名称不就行了？对于一个敲代码来说，命名是真的烦，不好评价，而且记住那么多的函数并且使用更麻烦，如果可以只记住一个函数名，然后让它在不同场景下发挥不同作用多好！

简单来说，不能用原生js实现函数重载，只能通过特定方法来实现，也就是闭包！

现在面试官给你一个需求：

const searcher = {}

addMethod(searcher, 'find', () => {
    console.log('查询所有用户')
})
addMethod(searcher, 'find', (name) => {
    console.log('按照姓名查询用户')
})
addMethod(searcher, 'find', (firstname, lastname) => {
    console.log('按照姓和名查询用户')
})

searcher.find() // 查询所有用户
searcher.find('lhy') // 按照姓名查询用户
searcher.find('l', 'hy'); // 按照姓和名查询用户

function addMethod(Object, name, fn) {} // 请实现这个方法

代码实现

function addMethod(Object, name, fn) { // 具体实现
    const old = Object[name];
    Object[name] = function(...args) {
        if(args.length === fn.length) return fn.apply(this, args);
        else if(typeof old === 'function') return old.apply(this, args);
    }
}

代码分析

• 也就是闭包的使用，通过闭包延长了生命周期
• 用闭包将全部函数塞进去
• 取函数的时候判断参数的数量就可以