Roadmap

    6 - Functions

    Functions

    When you declare a function, you can add type annotations after each parameter to declare what types of parameters the function accepts.

    Parameter type annotations go after the parameter name:

    ts
    // Input type annotation
    function greet(name: string) {
      console.log("Hello, " + name);
    }

    When a parameter has a type annotation, arguments to that function are checked against the type

    ts
    function greet(name: string) {
      console.log("Hello, " + name);
    }
    // Correct
    greet("John"); // Output: Hello, John
     
    // Error:
    greet(1); // Argument of type '1' is not assignable to parameter of type 'string'.
    Argument of type 'number' is not assignable to parameter of type 'string'.2345Argument of type 'number' is not assignable to parameter of type 'string'.

    Even if you don’t have type annotations on your parameters, TypeScript will still check that you passed the right number of arguments.

    ts
    function greet(name: string) {
      console.log("Hello, " + name);
    }
    greet(); // Error: Expected 1 arguments, but got 0.
    Expected 1 arguments, but got 0.2554Expected 1 arguments, but got 0.

    Return Type Annotations

    By default if your function does not include a return statement then Typescript will auto-infer the type as :void

    ts
    // The auto-inferred return type is :void
    function doSomething() {
      let a = 10;
    }

    void represents the return value of functions which don’t return a value. It’s the inferred type any time a function doesn’t have any return statements, or doesn’t return any explicit value from those return statements:

    Similarly for functions that do return a value, Typescipt will auto-infer the return type based on the output returned by the function

    ts
    // The auto-inferred return type is :number
    function add(a: number, b: number) {
      return a + b;
    }
     
    let result = add(2, 3);
    console.log(typeof result); // number

    You can also explicitly tell Typescript what you expect the return type to be

    ts
    // The explicitly set return type is :number
    function add(a: number, b: number): number {
      return a + b;
    }
     
    let result = add(1, 2);
     
    // Typescript will warn us if we try to use string methods,
    // since we explicitly said the function will return a number
     
    console.log(result.toLowerCase); // Property 'toLowerCase' does not exist on type 'number'.
    Property 'toLowerCase' does not exist on type 'number'.2339Property 'toLowerCase' does not exist on type 'number'.

    You usually don’t need a return type annotation for functions, since it will be auto-inferred but it's a good idea to include them for clarity so it's clear what the inputs and outputs of a function are expected to be and prevent accidental changes that can break code elsewhere.

    Besides primitive types and :void functions can also return Promises and other types, we will cover these in the intermediate tutorials

    TODO - Contextual typing/Anonymous functions