Creating and Using Functions in TypeScript

Tutorial 1 of 5

1. Introduction

In this tutorial, we aim to guide you through the basics of creating and using functions in TypeScript. Functions are an essential part of programming in any language. They help you break your code into reusable pieces, which can make your code more readable, understandable, and maintainable.

By the end of this tutorial, you will be able to:
- Understand what functions are in TypeScript
- Create your own functions
- Call and use these functions in your code

Prerequisites: Basic knowledge of programming concepts and familiarity with TypeScript.

2. Step-by-Step Guide

2.1 Defining a Function

To define a function in TypeScript, you use the function keyword, followed by the function's name, parentheses () which may include parameter names separated by commas, and finally the function body enclosed in curly braces {}. Here's an example:

function greet(name: string): void {
    console.log(`Hello, ${name}!`);
}

In this example, greet is the function name, name is a parameter, and void is the return type of the function. The function body is a single console.log statement.

2.2 Calling a Function

You can call a function by using its name followed by parentheses (). If the function requires parameters, you put the arguments within these parentheses.

greet('John');  // Outputs: Hello, John!

3. Code Examples

3.1 Basic Function

Let's start with a simple function that calculates the square of a number.

function square(num: number): number {
    return num * num;
}

let result = square(5);
console.log(result);  // Outputs: 25

In this example, square is a function that takes one parameter num of type number and returns a number. The function body simply returns the square of the input number.

3.2 Function with Multiple Parameters

Now, let's create a function that takes multiple parameters.

function fullName(firstName: string, lastName: string): string {
    return `${firstName} ${lastName}`;
}

let name = fullName('John', 'Doe');
console.log(name);  // Outputs: John Doe

In this example, fullName is a function that takes two parameters firstName and lastName and returns a string. The function body returns a string that combines both parameters with a space in between.

4. Summary

In this tutorial, we have covered the following points:
- How to define functions in TypeScript
- How to call and use these functions
- How to use parameters and return types

As next steps, consider exploring more complex function types like anonymous functions, arrow functions, and higher-order functions. You might also want to learn about optional and default parameters.

5. Practice Exercises

Here are some exercises to help you practice your new skills:

  1. Write a function add that takes two numbers as parameters and returns their sum.
  2. Write a function isEven that takes a number as a parameter and returns true if the number is even, false otherwise.

Solutions:
1.

function add(num1: number, num2: number): number {
    return num1 + num2;
}

console.log(add(4, 5));  // Outputs: 9
function isEven(num: number): boolean {
    return num % 2 === 0;
}

console.log(isEven(7));  // Outputs: false
console.log(isEven(8));  // Outputs: true

You can make these exercises more challenging by adding type checks and handling edge cases. Happy coding!