Mastering TypeScript: Functions, Enums, and Their Practical Use Cases
Functions:
A function is a block of statements used to perform a particular task.
Example:
// function declaration
// num1: number, num2: number => These are parameters
function calculateSum(num1: number, num2: number): number {
// function body
return num1 + num2; // return statement
}
const ans: number = calculateSum(5,6); // function call
console.log(ans); // 11
- A sequence of statements written within function forms function body.
- Functions are executed when it is invoked by a function call.
- Values can be passed to a function as function parameters and the function returns a value.
The parameter type is the data type of the parameter, and the return type is the data type of the returned value from the function.
With the TypeScript function, data types can be specified to the parameter passed to the function and to the function return values.
While defining the function, return the data with the same type as the function return type. While invoking the function pass the data with the same data type as the function parameter type, or else it will throw a compilation error.
Example:
// function declaration
// num1: number, num2: number => These are parameters
function calculateSum(num1: number, num2: number): number {
// function body
return num1 + num2; // return statement
}
const ans: number = calculateSum(5,"6"); //This will throw compilation error.
console.log(ans); // 11
Enum:
Enum in TypeScript is used to give more friendly names to a set of numeric values.
Syntax:
enum EnumName { property1, property2, property3};
For example
To store a set of size variables such as Small, Medium and Large with different numeric values, group those variables under a common Enum called Size.
enum Size {Small, Medium, Large}
By default, Enum’s first item will be assigned with zero as the value and the subsequent values will be incremented by one.
To get the value from an Enum use one of the following:
//Syntax EnumName.item
Size.Small
//Syntax EnumName[“item”]
Size[“Medium”]
Enum items can also be initialized with different values than the default value. If a different value is set for one of the variables, the subsequent values will be incremented by 1.
example:
//Initial value is set as 2, so subsequent values will be 3 and 5respectively
enum Size {Small=2, Medium, Large};
console.log("The medium size is " + Size.Medium);
Output:
The medium size is 3
Example 2:
//Initial value is set as 2, so subsequent values will be 3 and 5respectively
enum Size {Small=2, Medium=3, Large=5};
Q.Consider that a Developer needs to declare an enum variable named MobilePrice and assign three different parameters like Black, Gold, and White with 250, 280, and 300 dollars respectivtely as default values. It also consists of the function named calculateAmount which would help the developer in calculating totalAmount variable based on different parameter like discount and color of Mobile.
solution:
example 1.
// declaring enum variable and assigning default values
enum MobilePrice {Black, Gold, White}
// functon to calculate final amount
function calculateAmount(price: number): number {
let discount: number;
let totalAmount: number;
if (price === MobilePrice.Gold) {
discount = 5;
} else if (price === MobilePrice.White) {
discount = 8;
} else {
discount = 10;
}
totalAmount = price - price * discount / 100;
return totalAmount;
}
// lines to populate the Actual and Final price of Black color Mobile
console.log('Actual price of the Mobile is $' + MobilePrice.Gold);
console.log('The final price after discount is $' + calculateAmount(MobilePrice.Gold));
In this enum value is not given then it will give output:
Because, By default value of first variable is 0 and next would be increment by 1.
Example 2:
// declaring enum variable and assigning default values
enum MobilePrice {Black= 250, Gold= 280, White= 300}
// functon to calculate final amount
function calculateAmount(price: number): number {
let discount: number;
let totalAmount: number;
if (price === MobilePrice.Gold) {
discount = 5;
} else if (price === MobilePrice.White) {
discount = 8;
} else {
discount = 10;
}
totalAmount = price - price * discount / 100;
return totalAmount;
}
// lines to populate the Actual and Final price of Black color Mobile
console.log('Actual price of the Mobile is $' + MobilePrice.Gold);
console.log('The final price after discount is $' + calculateAmount(MobilePrice.Gold));
Output: