TypeScript Object Types

TypeScript Object Types: Annotations, Optional & Readonly Properties

TypeScript object types define the expected properties, value types, optional fields, and read-only access rules for structured JavaScript objects.

Object Type Modifier Syntax

• property?: type: Optional property (may be omitted or undefined).
• readonly property: type: Immutable property (cannot be reassigned after object creation).
• [key: string]: type: Index signature for dynamic key-value maps.

Practical Code Example

// Inline object type annotation
const dbConfig: {
  readonly host: string;
  port: number;
  database: string;
  connectionTimeout?: number; // Optional property
} = {
  host: "localhost",
  port: 5432,
  database: "production_db"
};

// Reassigning port is allowed
dbConfig.port = 5433;

// dbConfig.host = "remotehost"; // Error: Cannot assign to 'host' because it is a read-only property

function connectDatabase(config: typeof dbConfig): void {
  const timeout = config.connectionTimeout ?? 5000;
  console.log(`Connecting to PostgreSQL at ${config.host}:${config.port}/${config.database} (Timeout: ${timeout}ms)`);
}

connectDatabase(dbConfig);

Best Practices & Gotchas

• Extract Repeated Object Types to Interfaces or Type Aliases: Avoid inline object definitions for reusable data structures.
• Use readonly for Immutable Identifiers: Mark database IDs, created timestamps, and API tokens as readonly.
• Check for Optional Properties Safely: Use optional chaining (config.connectionTimeout?.toString()) when handling optional fields.

Self-Check Challenge

Create an object type with properties id (readonly number) and nickname (optional string). Initialize an object omitting nickname.