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"
}
objectSummary
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:
- Check If An Object Is Empty In TypeScript
- Get the Class Name of an Object in TypeScript
- Check if Object is instance of Class in TypeScript
Hello. My name is Khanh Hai Ngo. I graduated in Information Technology at VinUni. My advanced programming languages include C, C++, Python, Java, JavaScript, TypeScript, and R, which I would like to share with you. You will benefit from my content.
Name of the university: VinUni
Major: EE
Programming Languages: C, C++, Python, Java, JavaScript, TypeScript, R