javascript其实是不支持重载的,这篇文章会和java语言函数的重载对比来加深对javascript函数重载的理解。
以下我会假设读者不了解什么是重载所以会有一些很基础的概念的，如果你是大神那么你可以离开了。
说函数的重载之前大家要理解什么是函数的重载，由于开头说JavaScript不支持函数的重载(不代表不能实现重载)本文是以java来做对比的所以先说说java函数重载的实现看下面一段代码
public class Person {
public static void main(String[] args){
Person info = new Person();
info.show();
info.show("小明");
info.show("小明",24);
info.show(24,"小明");
}
public void show(){
System.out.println("没有参数可以执行");
}
public void show(String name){
System.out.println("----------- 1 --------------");
System.out.println("Perosn name:"+name);
}
public void show(String name,int age){
System.out.println("----------- 2 --------------");
System.out.println("Perosn name:"+name);
System.out.println("Perosn age:"+age);
}
public void show(int age,String name){
System.out.println("----------- 2 --------------");
System.out.println("Perosn age:"+age);
System.out.println("Perosn name:"+name);
}
}
//输出结果如下:
/**
没有参数可以执行
----------- 1 --------------
Perosn name:小明
----------- 2 --------------
Perosn name:小明
Perosn age:24
----------- 2 --------------
Perosn age:24
Perosn name:小明
**/ 在同一个Person出现了多次同名的show方法这些show方法参数个数不同或者参数类型不同 Java 会根据参数的个数和类型来判断应该调用哪个重载方法，参数和类型完全匹配的方法将被执行所以三个show方法都可以得到正确的执行
。
在来看看javascript如果在同一个作用域内有两个相同名字的函数那么最后一个会覆盖掉前一个重载就无从谈起把上面的java代码转换成JavaScript如下:。
class Person {
show(){
console.log("没有参数也可以执行");
}
show(name){
console.log("----------- 1 --------------");
console.log("Perosn name:"+name);
}
show(name,age){
console.log("----------- 2 --------------");
console.log("Perosn name:"+name);
console.log("Perosn age:"+age);
}
show(age,name){
console.log("----------- 2 --------------");
console.log("Perosn name:"+age);
console.log("Perosn age:"+name);
}
}
let person = new Person();
person.show();
person.show("小明");
person.show("小明",24);
person.show(24,"小明");如果你能猜出输出的正确结果证明你理解了为什么说JavaScript不支持重载。
/**
输出结果如下:
**/
----------- 2 --------------
Perosn name:undefined
Perosn age:undefined
----------- 2 --------------
Perosn name:小明
Perosn age:undefined
----------- 2 --------------
Perosn name:小明
Perosn age:24
----------- 2 --------------
Perosn name:24
Perosn age:小明连续4次输出都是执行了Person的最后那个show方法前面的同名方法都被覆盖了。本身JavaScript的参数也没有定义类型一说不能像Java根据参数定义类型调用的时候传参对应类型去执行相应的方法;JavaScript要想像java那样一个方法传入不同的参数得到不同的结果输出要怎么做？我们改写一下上面的js代码实现想java函数重载的功能。
class Person {
show(name,age){
if(name == null){
console.log("没有参数也可以执行");
}
if(typeof name == "string" && age == null){
console.log("----------- 1 --------------");
console.log("Perosn name:"+name);
}
if(typeof name == "string" && typeof age == "number"){
console.log("----------- 2 --------------");
console.log("Perosn name:"+name);
console.log("Perosn age:"+age);
}
if(typeof name == "number" && typeof age == "string"){
let tmp = name;
name = age;
age = tmp;
console.log("----------- 2 --------------");
console.log("Perosn age:"+age);
console.log("Perosn name:"+name);
}
}
}
let person = new Person();
person.show();
person.show("小明");
person.show("小明",24);
person.show(24,"小明");
//输出结果如下:
/**
没有参数可以执行
----------- 1 --------------
Perosn name:小明
----------- 2 --------------
Perosn name:小明
Perosn age:24
----------- 2 --------------
Perosn age:24
Perosn name:小明
**/以上我们完成了JavaScript函数重载的实现输出结果和java的例子一样，通过传入参数类型不同执行相应的操作实现重载。