使用不同参数的函数重载JavaScript

Question

I have this method called 'leer' (Learn in English) that atm takes in 2 words. 1 for a category and 1 to put in that category. Now I would like to add functionality whereby I can add a bunch of words to one category.

WoordenSchat.prototype.leer = function(categorie,naam){
    if (!this.hasOwnProperty(categorie)){
        this[categorie] = []
        this[categorie].push(naam)
    }
    else {
        this[categorie].push(naam)
    }
}

I could solve this by figuring out what sort of variable I receive in 'naam' via typeOf and then act accordingly, but I feel like this would result in a messy piece of code.

What I would like to do is have 2 functions:

• leer (categorie,naam)
• leer (categorie, [naam])

where by the one with an array of names (naam (Dutch) in plural) would call the first one in a for loop.

Is this possible in JavaScript? Because as far as I know there is no way of telling a Javascript method: "You take in this type of variable and this type only"

I know in python you could do things like this def functionName (categorie:str, naam: str) etc.

Answer 1

JavaScript doesn't support function overloading based on parameter types.
However, as @AlexK suggested , you can modify the function to accept a variable amount of parameters:

WoordenSchat.prototype.leer = function(categorie){
    if (!this.hasOwnProperty(categorie)){   // We only need to do this check once.
        this[categorie] = [];
    } 
    for(var i = 1; i < arguments.length; i++){
        this[categorie].push(arguments[i]); // `arguments[i]` is the current `naam`.
    }
};

This starts looking for parameters at arguments[1] , since arguments[0] is categorie . Then, every single naam passed to leer will be pushed onto the array.

You can call the function like this:

myWoordenSchat.leer('programmeren', 'functies', 'variabelen', 'constanten');

You can add as many or as few parameters after categorie as you wish.

This function can be simplified a little bit more:

WoordenSchat.prototype.leer = function(categorie){
    this[categorie] = this[categorie] || []; // Make sure `this[categorie]` exists
    for(var i = 1; i < arguments.length; i++){
        this[categorie].push(arguments[i]);  // `arguments[i]` is the current `naam`.
    }
};

Now, you could modify the function to accept stings or an array, instead:

WoordenSchat.prototype.leer = function(categorie, namen){
    this[categorie] = this[categorie] || [];

    if(typeof namen === 'string'){   // The first parameter after `categorie` is a string
        namen = arguments.splice(1); // So, get all parameters after `categorie` as array
    }

    for(var i = 0; i < namen.length; i++){
        this[categorie].push(namen[i]);
    }
};

So, if the first parameter after categorie is a string, iterate over all parameters, otherwise, iterate over the namen array.

You should be able to call the function like this:

myWoordenSchat.leer('programmeren', 'functies');
myWoordenSchat.leer('programmeren', 'functies', 'variabelen', 'constanten');
myWoordenSchat.leer('programmeren', ['functies', 'variabelen', 'constanten']);

Answer 2

If ES2015 is an option:

WoordenSchat.prototype.leer = function(categorie, ...namen) {
  if (! this.hasOwnProperty(categorie)) {
    this[categorie] = [];
  }
  this[categorie].push(...namen);
}