How To Declare A Function With An Object Return Type In TypeScript

Declare a function with an Object return type in TypeScript

Knowing how to declare a function with an object return type in TypeScript is one of the most necessary skills that every TypeScript programmer needs. If you are still struggling and do not know how to do, don’t worry! Because in this tutorial, we will describe some of the most common ways to do this task. 

Declare a function with an object return type in TypeScript

Explicitly type the function

In our programs, we always want our variable to be strictly typed. And the way we make our function have the object return type is just like other types and like typing a variable: set the return type after the parameter list.

function Function() : Type {

}

Example: 

function myFunction(): { website: string; year: number } {
    return {
        website: "LearnShareIT.com",
        year: 2022,
    };
}

console.log(myFunction());
console.log(typeof myFunction());

Output

{
  "website": "LearnShareIT.com",
  "year": 2022
} 
object 

If your type is too long, you can do like this to make the code looks cleaner:

type Person = {
    name: string,
    age: number,
    gender: string,
    address: string,
    state: string,
    job: string,
    phone: string,
    email: string,
    website: string
};

function MyFunction(): Person {
    return {
        name: "Tommy",
        age: 34,
        gender: "male",
        address: "145abc",
        state: "Florida",
        job: "Teacher",
        phone: "0123456789",
        email: "[email protected]",
        website: "LearnShareIT.com"
    };
}

console.log(MyFunction());
console.log(typeof MyFunction());

Output: 

{
  "name": "Tommy",
  "age": 34,
  "gender": "male",
  "address": "145abc",
  "state": "Florida",
  "job": "Teacher",
  "phone": "0123456789",
  "email": "[email protected]",
  "website": "LearnShareIT.com"
} 
object 

Just…let TypeScript do it 

When we don’t explicitly type our function, TypeScript will automatically infer it.

function Person() {
    return {
        name: "Tommy",
        age: 34,
        gender: "male",
        address: "145abc",
        state: "Florida",
        job: "Teacher",
        phone: "0123456789",
        email: "[email protected]",
        website: "LearnShareIT.com"
    };
}

console.log(Person());
console.log(typeof Person());

Output: 

{
  "name": "Tommy",
  "age": 34,
  "gender": "male",
  "address": "145abc",
  "state": "Florida",
  "job": "Teacher",
  "phone": "0123456789",
  "email": "[email protected]",
  "website": "LearnShareIT.com"
} 
object 

However, it is still better if we explicitly type our function because in some cases, TypeScript can misunderstand the type we want to set and thus lead to unnecessary errors.

Using index signature

If we don’t know all the properties names of our object, we can use the index signature.

Example: 

type Type = {
    website: string,
    year: number,
    [key: string]: any
};

function myFunction(): Type {
    return {
        website: "LearnShareIT.com",
        year: 2022,
        author: "nhk"
    };
}

console.log(myFunction());
console.log(typeof myFunction());

Output:

{
  "website": "LearnShareIT.com",
  "year": 2022,
  "author": "nhk"
} 
object

Summary

In this tutorial, we have covered some of the methods to declare a function with an object return type in TypeScript. There are basically two main ways to do so: we can type it explicitly or just let TypeScript automatically infer it. 

Maybe you are interested:

Leave a Reply

Your email address will not be published. Required fields are marked *