Function Overloading in JavaScript

Function Overloading in JavaScript (Made with Excalidraw)

Function Overloading In Programming Languages

Function overloading means creating multiple functions with different implementations. The rules in function overloading are

1. The same function name is used for more than one function definition.
2. The functions must differ by the types of their parameters.

Function Overloading in JavaScript

JavaScript does not support function overloading.

/**
* Display Name
* @param {string} name Name
*/
function displayName(name) {
	return `Hi ${name}`;
}
/**
* Display Name
* @param {string} fName First Name
* @param {string} lName Last Name
* The above function will be overwritten by this function.
*/
function displayName(fName, lName) {
	return `Hi ${fName} ${lName}`;
}
displayName('Ana');    // 'Hi Ana undefined'

In the above code example, the second function will override the first function. This is because function declarations are hoisted in JavaScript.

Function declarations in JavaScript are hoisted to the top of the enclosing function or global scope.

Handle same function names in JavaScript