Understanding TypeScript Functions and Type Aliases

TypeScript is a superset of JavaScript that introduces static typing to the language. One of its powerful features is the ability to define custom types and enhance the clarity and robustness of your code. In this article, we'll explore various aspects of TypeScript functions and type aliases.

Type Aliases in TypeScript

Type aliases in TypeScript allow you to create a name for a type that you can use throughout your code. They provide a way to make your code more readable and maintainable by giving meaningful names to complex types.

1. Basic Type Aliases

In the provided TypeScript code, we encounter the use of type aliases for various purposes. For example:

type stringNumber = string | number;
type stringNumberArray = (string | number)[];

type UserObj = {
  prop1: string,
  prop2: boolean,
  prop3: stringNumberArray,
  prop4: stringNumber,
};

Here, stringNumber represents a type that can be either a string or a number. The UserObj type alias defines an object structure with specific property types.

2. Literal Types

Literal types in TypeScript allow you to specify exact values that a variable can take. This is demonstrated in the code snippet:

let zeroUsername: "motu" | "patlu" | "zatka";
zeroUsername = "motu";
zeroUsername = "patlu";

In this example, zeroUsername can only be assigned one of the specified string literal values.

3. Type Alias for Functions

Type aliases can also be used to define the structure of functions. In the given code:

type mathFunction = (a: number, b: number) => number;

let add: mathFunction = function (a, b) {
  return a + b;
};

The mathFunction type alias defines a blueprint for functions that take two parameters of type number and return a number.

Function Parameters in TypeScript

1. Optional Parameters

In TypeScript, you can make function parameters optional by adding a ? after the parameter name. However, type aliases cannot be used directly for optional or default parameters. For example:

const sumOfThreeOrTwo = (a: number, b: number, c?: number) => {
  return c !== undefined ? a + b + c : a + b;
};

Here, the third parameter c is optional, and the function behaves accordingly.

2. Rest Parameters

Rest parameters allow a function to accept an indefinite number of arguments. The provided code showcases the use of rest parameters in a function:

const addAll = (...nums: number[]): number => {
  return nums.reduce((prev, curr) => {
    return prev + curr;
  });
};

The ...nums syntax collects all remaining arguments into an array named nums.

3. Default Parameters

Default parameters provide a way to specify a default value for a function parameter if a value is not provided. The following example demonstrates the use of default parameters:

const defaultParam = (a: number = 10, b: number, c: number = 2): number => {
  let sum: number = a + b + c;
  return sum;
};

message(defaultParam(10, 3)); // Result: 15
message(defaultParam(undefined, 10)); // Result: 12

In this function, a and c have default values if not provided during the function call.

TypeScript's ability to define custom types and structure functions through type aliases brings a level of clarity and safety to your code. Understanding how to use type aliases for various scenarios, including functions with optional, rest, and default parameters, is crucial for writing robust and maintainable TypeScript code.

Thanks for Reading!

Thanks for checking out our TypeScript functions and type aliases blog. We hope you found it helpful. If you have any questions or suggestions for future topics, feel free to reach out.

#Happy coding!