Open In App

How to Create Objects with Dynamic Keys in TypeScript ?

Last Updated : 07 Mar, 2024
Improve
Improve
Like Article
Like
Save
Share
Report

In TypeScript, we can create objects with Dynamic Keys by providing the index signature syntax. We can define the index signature, that allows objects to have keys with specific types. We can also use the Record Utility to create objects with Dynamic Keys.

These are the following approaches:

Create Objects with Dynamic Keys Using Index Signature

In this approach, we are using an index signature with the interface dict to create an object where keys are dynamically typed strings, allowing for properties like ‘title,’ ‘category,’ ‘likes,’ and ‘foundedYear‘ with values of either strings or numbers.

Syntax:

{
[keyType: KeyType]: ValueType;
}

Example: The below example uses Index Signature to Create Objects with Dynamic Keys in TypeScript.

Javascript




interface dict {
    [key: string]: string | number;
}
const obj: dict = {
    title: 'GeeksforGeeks',
    category: 'Computer Science',
    likes: 10000,
    foundedYear: 2008,
};
 
console.log(obj);


Output:

{
"title": "GeeksforGeeks",
"category": "Computer Science",
"likes": 10000,
"foundedYear": 2008
}

Create Objects with Dynamic Keys Using Record Type

In this approach, we are using the Record type with a dynamic string key type (keys) to create an object (obj) where keys can be any string, providing flexibility for properties like ‘title,’ ‘category,’ ‘likes,’ ‘foundedYear,’ and ‘founder‘ with values of either strings or numbers.

Syntax:

Record<Keys, Type>

Example: The below example uses Record Type to Create Objects with Dynamic Keys in TypeScript.

Javascript




type keys = string;
const obj: Record<keys, string | number> = {
    title: 'GeeksforGeeks',
    category: 'Computer Science',
    likes: 10000,
    foundedYear: 2008,
    founder: "Sandeep Jain",
};
 
console.log(obj);


Output:

{
"title": "GeeksforGeeks",
"category": "Computer Science",
"likes": 10000,
"foundedYear": 2008,
"founder": "Sandeep Jain"
}


Like Article
Suggest improvement
Share your thoughts in the comments

Similar Reads