Updated July 5, 2023
Introduction to TypeScript Optional Parameters
In TypeScript, we actively define an optional parameter as a parameter that can be made optional when calling a function. By adding a “?” symbol at the end of the parameter declaration, we actively mark it as optional. This feature allows us to pass or omit values for these parameters when invoking the function without triggering any errors.
Working of Optional Parameters in Typescript with Examples
In this article, we will discuss the optional parameters feature provided in the typescript. i.e., not optional parameters are called default parameters or normal parameters where it is a must and compulsory to pass the values to these default parameters else. We should note that whenever we are making any parameter an optional parameter in the function, it is a must that one or more default parameters must follow any optional parameter in the function.
Now let us see the syntax of how to declare optional parameters, along with examples in the below section.
Syntax:
function func_name(parameter1, parameter2?)
{
Set of code or instructions
}
In the above syntax, we can see we have two parameters. In the above function, parameter 1 is the default parameter, and parameter2 is appended with “?” which is an optional parameter. So where parameter2 can be optional such as there is no compulsion of passing values when the function func_name is called, and the parameter1 value must be passed as it is compulsory else it will throw an error, and when the function has two parameters and among them, if one is optional then while calling function only one value can be passed. we can additionally check if the parameters are been initialized or not by using the “typeof (parameter_name) ! = = ‘undefined’ ” expression as making it a condition in the “if” statement where when we are returning the result having all three parameters which may sometime lead to an error saying the required parameter cannot be followed as an optional parameter.
Example #1
Code:
function add(a: number, b: number, c?: number): number {
console.log("Addition of two numbers is ")
return a + b;
}
console.log("Demonstration of optional parameter in Typescript")
let res = add(2,3)
console.log(res)
//let res1 = add(3)
//console.log(res1)
Output:
In the above program, we can see first we have defined a function for calculating the addition of two numbers, and further, we may require to calculate the addition of three numbers also, therefore we are declaring 3 parameters “a”, “b”, and “c” and making last parameter “c” as an optional parameter and rest as default parameters. In this program, we are returning only the result of the addition of two numbers only, so there is no need for the third parameter, and hence we have not used it within the function code as it is an optional parameter.
Now let us see another example for demonstrating the optional parameter and using this parameter within the function code in the below section.
Example #2
Code:
function display(Inst_name: string, Course_name?: string): void {
console.log(" The Institution name is given as: ")
console.log(Inst_name)
console.log(" The Course provided is given as: ")
console.log(Course_name)
}
console.log(" Demonstration of using optional parameter within the function code")
display("Educba")
display("Educba", "Python")
Output:
In this program, if we call the function and only provide a value for one parameter, the optional parameter will take the value of “undefined” by default.
function display(Inst_name: string, Course_name?: string): void {
console.log(" The Institution name is given as: ")
console.log(Inst_name)
if (typeofCourse_name !== 'undefined')
{
console.log(" The Course provided is given as: ")
console.log(Course_name)
}
}
console.log(" Demonstration of using optional parameter within the function code")
display("Educba")
display("Educba", "Python")
Output:
Now in the above screenshot, we can see though we have not passed any value for the optional parameter, it will not display “undefined.” It will only print the value passed to the default parameter.
Conclusion
To mark a parameter as optional, we append “?” at the end of the parameter declaration. We have seen a simple example demonstrating how to declare optional parameters.
Recommended Articles
We hope that this EDUCBA information on “TypeScript Optional Parameters” was beneficial to you. You can view EDUCBA’s recommended articles for more information.