Default parameters allow you to initialize function parameters with default values if no value or undefined
is passed. In this tutorial, I will explain how to use default function parameters in TypeScript with some examples. This feature simplifies function calls and makes your code more robust and easier to maintain.
What Are Default Parameters in TypeScript Functions?
Default parameters are a feature in TypeScript (and JavaScript) that let you specify a default value for a parameter. If the caller does not provide a value for that parameter, the default value is used. This is particularly useful for creating functions with optional parameters.
Basic Example
Let’s start with a simple example where we define a function to greet a user, with a default parameter for the greeting message.
Here is the example and the complete TypeScript code.
function greet(name: string, greeting: string = "Hello"): string {
return `${greeting}, ${name}!`;
}
console.log(greet("Alice")); // Output: Hello, Alice!
console.log(greet("Bob", "Hi")); // Output: Hi, Bob!
In this example, the greeting
parameter has a default value of "Hello"
. When we call greet("Alice")
, it uses the default greeting. When we call greet("Bob", "Hi")
, it uses the provided greeting.
Here is the output in the screenshot below:

Check out How to Pass a Function as a Parameter in TypeScript?
Default Parameters with Multiple Arguments
Default parameters can be used in TypeScript functions with multiple arguments. You can set defaults for some or all of the parameters.
Here is an example.
function createUser(firstName: string, lastName: string, age: number = 30, country: string = "USA"): string {
return `Name: ${firstName} ${lastName}, Age: ${age}, Country: ${country}`;
}
console.log(createUser("John", "Doe")); // Output: Name: John Doe, Age: 30, Country: USA
console.log(createUser("Jane", "Smith", 25)); // Output: Name: Jane Smith, Age: 25, Country: USA
console.log(createUser("Emily", "Johnson", 40, "Canada")); // Output: Name: Emily Johnson, Age: 40, Country: Canada
In this example, the age
and country
parameters have default values. If these parameters are not provided, the defaults are used.
Here is the output in the screenshot below:

Read How to Use Generic Arrow Functions in TypeScript?
Using Default Parameters with Destructured Objects
Default parameters can also be used with destructured objects, which is particularly useful when dealing with configuration objects.
Here is the complete TypeScript code and the example.
interface Config {
url: string;
method?: string;
timeout?: number;
}
function fetchData({ url, method = "GET", timeout = 5000 }: Config): void {
console.log(`Fetching data from ${url} with method ${method} and timeout ${timeout}`);
}
fetchData({ url: "https://api.example.com" }); // Output: Fetching data from https://api.example.com with method GET and timeout 5000
fetchData({ url: "https://api.example.com", method: "POST" }); // Output: Fetching data from https://api.example.com with method POST and timeout 5000
fetchData({ url: "https://api.example.com", timeout: 10000 }); // Output: Fetching data from https://api.example.com with method GET and timeout 10000
In this example, the fetchData
function takes a configuration object with default values for method
and timeout
. If these properties are not provided in the object, the defaults are used.
Check out How to Get the Return Type of a Function in TypeScript?
Benefits of Default Parameters in a TypeScript Function
- Simplifies Function Calls: You don’t need to provide values for every parameter, making function calls cleaner and more readable.
- Reduces Code Duplication: Default parameters help avoid repetitive code by providing a standard value that can be overridden when necessary.
- Improves Code Robustness: Functions with default parameters are less likely to encounter
undefined
errors, leading to more reliable code.
Conclusion
In this tutorial, I explained how to use default function parameters in TypeScript with examples. By setting default values for parameters, you can simplify function calls, reduce code duplication, and improve the overall robustness of your code. Let me know in the comment below if you still have questions.
You may also like:
I’m Bijay Kumar Sahoo, and I am honored to be awarded the Microsoft MVP. With over 18 years of experience in the IT industry, I got a chance to work on SharePoint Framework (SPFx) development, TypeScript, React, JavaScript, etc. My journey has taken me through esteemed organizations such as TCS, HP, and KPIT, where I have honed my skills and expanded my expertise. Check out more about me here.