Guides / 2026-10-21

Optional vs Nullable Properties in TypeScript

In TypeScript, optional means the property may be omitted (name?: string). Nullable means the value may be null (name: string | null). JSON samples often mix both.

This tool only sees the JSON you paste. It cannot know that a backend field is optional unless a key is missing in at least one object in an array, or you choose Mark optional for nulls.

Missing keys across array items become optional.

[
  { "id": 1, "name": "Ada" },
  { "id": 2, "name": "Grace", "role": "admin" }
]

// Generated locally in your browser. No data was sent to a server.

export interface PersonItem {
  id: number;
  name: string;
  role?: string;
}

export type Person = PersonItem[];

A null value is typed as null when Null fields is Match sample.

{ "id": 1, "deletedAt": null }

// Generated locally in your browser. No data was sent to a server.

export interface Record {
  id: number;
  deletedAt: null;
}

Mark optional adds ? to properties whose sample value is null.

{ "id": 1, "deletedAt": null }

// Generated locally in your browser. No data was sent to a server.

export interface Record {
  id: number;
  deletedAt?: null;
}

Edge cases

A field that is sometimes a string and sometimes null becomes a union that includes null. Mark optional also makes that property optional.
Optional and nullable are not interchangeable. name?: string forbids null; name: string | null requires the key to be present.
If every object in the array has the key, it stays required even if you wish it were optional—add a sample without that key, or edit the output.

Open the converter with your own payload when you want to copy or download the generated .ts file.