JSON to JSDoc typedef

Put the output at the top of a JavaScript file, then use /** @type {Root} */ to get autocomplete and checks in your editor.

Loading the tool…

Processing and privacy: The result is calculated inside your browser and your data is not sent to any server.

How to use it

  1. Enter json input and root type name.
  2. The result appears straight away and updates as you edit.
  3. Copy the result, or copy a link that keeps the same values to share it.

How it is calculated

string, number, boolean, T[] and *, with a @typedef per object and a @property per key. An optional key is written [name] and null adds |null. If an object has a key that is not a valid identifier, its type is written as an object literal inside double braces {{ }}, which TypeScript understands.

Example

Inputs: Root type name = Root. Result: Generated code: /** * @typedef {Object} Order * @property {string} order_id * @property {number} total * @property {string|null} coupon */ /** * @typedef {Object} Address * @property {string} city * @property {string} postal_code */ /** * @typedef {Object} Root * @property {number} id * @property {string} name * @property {string} email * @property {boolean} is_active * @property {number} balance * @property {string[]} tags * @property {Address} address * @property {Order[]} orders */; Types generated: 3; Fields: 13.

{
  "id": 1024,
  "name": "Sara Ahmed",
  "email": "sara@example.com",
  "is_active": true,
  "balance": 1520.75,
  "tags": ["vip", "riyadh"],
  "address": { "city": "Riyadh", "postal_code": "12211" },
  "orders": [
    { "order_id": "A-1", "total": 99.5, "coupon": "EID10" },
    { "order_id": "A-2", "total": 120, "coupon": null }
  ]
}
/**
 * @typedef {Object} Order
 * @property {string} order_id
 * @property {number} total
 * @property {string|null} coupon
 */

/**
 * @typedef {Object} Address
 * @property {string} city
 * @property {string} postal_code
 */

/**
 * @typedef {Object} Root
 * @property {number} id
 * @property {string} name
 * @property {string} email
 * @property {boolean} is_active
 * @property {number} balance
 * @property {string[]} tags
 * @property {Address} address
 * @property {Order[]} orders
 */

Limits and caveats

  • The definitions serve the editor and checkJs only; they do not validate data at runtime.

Questions about this tool

How do I use the typedef in VS Code?

Write /** @type {Root} */ before a variable or @param {Root} on a function, and the fields autocomplete.

What does [qty] mean in @property?

Square brackets mark the key as optional, because it was missing from some array items.

Is my JSON sent to a server?

No. The conversion runs in your browser and the JSON never leaves your device.