How ECMAScript implements function overloading

Definition of overloaded function: In the same declaration domain, if there are multiple functions with the same name but different parameter tables (different parameter types or different number of parameters), the return value types can be the same or different functions, which are called functions. It is an overloaded function. The parameter list of a function is the unique identifier to distinguish overloaded functions, not the return value of the function. Overloaded functions are often used to implement similar functions but deal with different data types.

However, ECMAScript functions cannot be overloaded in the traditional sense. If two functions with the same name are defined in ECMASript, the name belongs only to the function defined later. example:

function Add(a){
    return a+10;
};
function Add(a){
    return a+20;
}

var result=Add(2);
alert(result);     //22

However, function overloading can be achieved by judging the number and type of incoming parameters.

1. By judging the number of incoming parameters

Parameters in ECMAScript are represented internally as an array. Within the body of the function, the arguments array can be accessed through the arguments object. The arguments object is similar to an array, and each element of it can be accessed using the square bracket syntax (that is, arguments[0] is the first argument), and the length property is used to determine the number of arguments passed. You can use length to determine the number of parameters passed, and then perform different operations. example:

function doSum(){
   if(arguments.length==1){
     alert(arguments[0]+20);
} else if(arguments.length==2){
     alert(arguments[0]+arguments[1]); 
}
}
doSum( 10);     // 30 
doSum(10,60);      // 70

A few notes on the parameters of EMCAScript functions: In ECMAScript functions, named parameters are for convenience only, not required. That is, even if no named parameters appear when the function is defined here, as long as the parameters are passed in when they are actually used, they can be accessed through arguments.

There is another way to implement overloading using the closure feature, see https://www.cnblogs.com/yugege/p/5539020.html for details.

2. By judging the type of incoming parameters

To detect whether a variable is a primitive data type, you can use the typeof operator to determine whether a variable is string, number, boolean, or undefined. Note that the typeof operator returns object if the value of the variable is an object or null. Example of use:

function DoSomething(){
    if(typeof(arguments[0])== "number"){
       alert(arguments[0]+10);
} else if(typeof(arguments[0])== "string"){
       alert(arguments[0].split(""));
     }
}
DoSomething(10);            //20
DoSomething("Hello");      //H,e,l,l,o

To know what type of variable an object variable is, use the instanceof operator. The instanceof operator returns true if the variable is an instance of the given reference type. By convention, all reference type values are instances of Object, so instanceof will always return true when checking whether a reference type is an instance of the Object constructor. But if the instanceof operator is used to check the primitive type, it will always return false. Example of use:

function DoSomething(a){
    if(a instanceof Array){
       alert(a.length);
} else if(a instanceof Object){
       alert(a.name);
     }
}
DoSomething([1,2,3]);                     //3
DoSomething({"name":"Sofia"});     //Sofia

How ECMAScript implements function overloading

Guess you like