Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Default Values | Functions
Introduction to TypeScript
course content

Course Content

Introduction to TypeScript

Introduction to TypeScript

1. TypeScript Fundamentals
2. Conditional Statements
3. Arrays
4. Loops
5. Functions

bookDefault Values

Another feature of functions in TypeScript is default parameter values. Default values are often used alongside or in place of optional parameters. You can set a default value for a parameter, and if you don't specify a value for that parameter when calling the function, it will be initialized with the default value.

Let's take a look at an example:

123456
function createBankTransaction(amount: number, description: string = "No description provided") { console.log(`Transaction: ${description}, Amount: $${amount}`); } createBankTransaction(100); // No description provided: Transaction: No description provided, Amount: $100 createBankTransaction(200, "Deposit"); // With provided description: Transaction: Deposit, Amount: $200
copy

Here's the simplest example of a function for conducting bank transactions. This function will provide us with a notification of the transaction amount and its description.

Users don't always like to provide descriptions for their transactions, so this field is optional. As you can see, to specify a default value that tells us there's no description for the transaction, we used the equal sign and the value we want to pass as the default. Therefore, if this parameter is not defined when calling the function, the default value will be used. Let's take a look at the syntax again:

Also, it's worth noting that you can use any number of different parameters in functions. You can use 2 optional parameters, 31 default parameters, or even 792 regular parameters. I wouldn't recommend using more than 792 parameters, or people might look at you with disdain. Let's take a look at a similar example:

123456789101112131415161718192021222324252627282930313233
function orderProduct(productName: string, quantity: number = 1, discount?: number, shippingMethod = "Standard", giftWrap = false, deliveryDate = "Tomorrow"): void { let totalCost = 0; // Calculate the product cost let basePrice = 100; // Cost per unit of the product if (discount !== undefined) { basePrice -= discount; } totalCost = basePrice * quantity; // Add shipping cost if (shippingMethod === "Express") { totalCost += 10; } // Add gift wrapping cost if (giftWrap) { totalCost += 5; } console.log(`Order Details: Product: ${productName} Quantity: ${quantity} Shipping Method: ${shippingMethod} Gift Wrap: ${giftWrap} Delivery Date: ${deliveryDate} Total Cost: $${totalCost}`); } // Function call examples: orderProduct("Laptop"); // Defaults to 1 unit, standard shipping, no discount, no gift wrapping orderProduct("Smartphone", 2, 20, "Express", true); // Order 2 smartphones with a 20% discount, express shipping, and gift wrapping orderProduct("Headphones", 3, undefined, "Standard", false, "Next week"); // Order 3 headphones with no discount, standard shipping, and delivery next week
copy

In this example:

  • productName is a required parameter;
  • quantity, discount, shippingMethod, giftWrap, and deliveryDate all have default values and can be omitted when calling the function;
  • The orderProduct function takes parameters, calculates and prints the total cost of an order, and its details.

This example shows how optional and default parameters can be used to create flexible functions with various usage scenarios.

The code turned out to be quite extensive, but I hope it demonstrates how parameters work in functions. If you understood everything, you're doing great!

What is the purpose of using default parameters in a TypeScript function?

What is the purpose of using default parameters in a TypeScript function?

Select the correct answer

Everything was clear?

How can we improve it?

Thanks for your feedback!

Section 5. Chapter 5
some-alt