How to Enforce the type of the indexed members of a Typescript object

TypeScript is a strongly typed, object-oriented programming language built on JavaScript. One of its powerful features is the ability to enforce types of an object's indexed members using index signatures. This allows you to define the shape of objects with dynamic properties while maintaining type safety.

An index signature specifies the types for both keys and values in an object. It's particularly useful when you need objects with unknown property names but known value types.

Syntax

interface ObjectType {
    [key: string]: ValueType;
}

// Or inline
let objectName: { [key: string]: ValueType } = {};

The key type is usually string or number, while the value type can be any valid TypeScript type.

Example 1: String Keys with Object Values

This example demonstrates a phone book where names (strings) map to Person objects:

// Person interface
interface Person {
    name: string;
    age: number;
}

// PhoneBook interface with index signature
interface PhoneBook {
    [key: string]: Person;
}

let phoneBook: PhoneBook = {};

phoneBook['Person 1'] = { name: 'ABC', age: 30 };
phoneBook['Person 2'] = { name: 'XYZ', age: 25 };
phoneBook['Person 3'] = { name: 'MNO', age: 10 };

console.log(phoneBook);

{
  'Person 1': { name: 'ABC', age: 30 },
  'Person 2': { name: 'XYZ', age: 25 },
  'Person 3': { name: 'MNO', age: 10 }
}

Example 2: Numeric Keys with Object Values

Here's a shopping cart using numeric IDs as keys:

interface Product {
    name: string;
    price: number;
}

// ShoppingCart interface with numeric index signature
interface ShoppingCart {
    [key: number]: Product;
}

let cart: ShoppingCart = {};

cart[1] = { name: 'Shirt', price: 20 };
cart[2] = { name: 'Pants', price: 30 };
cart[3] = { name: 'Shoes', price: 40 };

console.log(cart[1]);
console.log(cart[2]);
console.log(cart[3]);

{ name: 'Shirt', price: 20 }
{ name: 'Pants', price: 30 }
{ name: 'Shoes', price: 40 }

Example 3: Mixed Index Signatures

You can combine index signatures with known properties:

interface Config {
    version: string;          // Known property
    [key: string]: string;    // Index signature
}

let appConfig: Config = {
    version: '1.0.0',
    theme: 'dark',
    language: 'en'
};

console.log(appConfig.version);
console.log(appConfig.theme);

1.0.0
dark

Key Benefits

Best Practices

Use index signatures when you need objects with dynamic keys but known value types. However, consider using Map or specific interfaces when the structure is more predictable, as index signatures can make code harder to maintain if overused.

Conclusion

Index signatures provide a powerful way to enforce type safety for objects with dynamic properties in TypeScript. They're essential for scenarios like configuration objects, dictionaries, and data mappings where property names aren't known at compile time.