Dev Utilities
How to Find and Copy the Exact Path to Any Value in a JSON Tree
Stop guessing at nested JSON. Learn how JSON path notation works and how to explore an API response and copy the precise path to any value in seconds.
Try the toolJSON Path Finder →You are staring at a 500-line API response, and you need the path to one buried value so you can pull it out in code. Counting brackets by hand is error-prone, and a single wrong index means a Cannot read properties of undefined at runtime. A path finder lets you click the value you want and get its exact accessor string. This guide explains the notation and how to use it.
How JSON path notation works
A JSON path is just the chain of keys and indexes you follow from the root to a value. Two equivalent styles are common:
- Dot notation for object keys:
user.address.city - Bracket notation for array indexes and awkward keys:
items[0]ordata["first-name"]
You mix them freely. Bracket notation is required when a key contains a space, a hyphen, or starts with a digit, because those cannot follow a dot in JavaScript.
A worked example
Consider this response:
{
"order": {
"id": "A-1007",
"customer": { "name": "Ada", "email": "ada@example.com" },
"items": [
{ "sku": "PEN-01", "qty": 3 },
{ "sku": "PAD-02", "qty": 1 }
]
}
}
The paths to individual values are:
order.id→"A-1007"order.customer.email→"ada@example.com"order.items[1].sku→"PAD-02"
That last one is where mistakes happen: items is an array, so you index it with [1] (the second element, since indexes start at 0) before continuing to .sku. Once you have the path, using it in code is direct:
const sku = data.order.items[1].sku;
console.log(sku); // "PAD-02"
// Optional chaining guards against missing branches
const email = data?.order?.customer?.email ?? null;
Rather than trace those brackets manually, paste the JSON into the JSON Path Finder, expand the tree, and click any value to copy its exact path. Everything runs locally in your browser, so even sensitive API payloads never leave your machine.
A practical walkthrough
- Copy a response from your browser's network tab or a log line.
- Paste it into the path finder, which parses it into a collapsible tree.
- Expand the branch you care about and click the target value.
- Copy the generated path and drop it straight into your code, test assertion, or config.
This is especially handy for writing test assertions, configuring a mapping in an ETL job, or building a JSONPath query for a tool that expects one.
Common pitfalls
- Off-by-one indexes. The first array element is
[0]. Reading a path off a tree removes the guesswork entirely. - Special keys need brackets. A key like
"user-id"or"2fa"must be accessed asdata["user-id"], neverdata.user-id. - Assuming a branch exists. Optional or nullable fields can be missing; guard deep access with optional chaining (
?.) so one absent key does not throw. - Malformed input. A path finder needs valid JSON. If parsing fails, run the text through the JSON Validator first to pinpoint the syntax error.
Conclusion
A JSON path is simply the route from the root to a value, written as keys and indexes — and reading it off a rendered tree beats counting brackets every time. Expand, click, copy, paste. For deeper work with the same data, format it for readability with the JSON Formatter or turn the shape into typed interfaces with JSON to TypeScript.