js简单实现函数重载

函数重载

在前端开发中，JavaScript 并不支持像其他语言（如 C++ 或 Java）中那样的函数重载，其中可以根据参数的不同来调用不同的函数。在 JavaScript 中，函数名是唯一的标识符，而不是函数签名。因此，定义具有相同名称但不同参数数量或类型的多个函数将会覆盖前面的定义。

但是，你可以通过一些技巧来模拟函数重载的行为，比如使用条件语句或默认参数来处理不同情况。
那如何使用js代码模拟实现函数重载呢

具体实现：

封装

function createOverload(){
	// 用于存储不同参数的函数
	const callMap = new Map()
	// 
	function overload(...agrs){
		// 获取参数类型，用 , 拼接
		const types = args.map(k=>typeof k).join(',')
		// 判断callMap中是否存在该类型组成的键
		if (callMap.has(types)) {
			return callMap.get(types).apply(this, args)
		}
		// 找不到则抛出错误
		throw 
	}
	overload.addImpl = function(...agrs){
		// 获取重载需要执行的回调
		const fn = args.pop()
		// 判断是否存在
		if(typeof fn !== 'function' || !fn){
			return;
		}
		const types = agrs.join(',')
		callMap.set(types,fn)
	}
}

声明

const getUser = new createOverLoad()
overloadFn.addImpl(() => {
  console.log('无参数情况')
})
overloadFn.addImpl('number', () => {
  console.log('一个数字参数情况')
})
overloadFn.addImpl('number', 'number', () => {
  console.log('两个数字参数情况')
})
overloadFn.addImpl('string', () => {
  console.log('一个字符串参数情况')
})

测试

overloadFn()
overloadFn(1)
overloadFn(1, 2)
overloadFn('hello')
overloadFn('hello', '1')

结果

成功！

总的来说，尽管 JavaScript 本身不支持函数重载，但通过一些模拟的技巧，可以实现类似的效果，提高前端开发中代码的可读性、可维护性和健壮性，同时也有助于提高开发效率。