JSON Tutorial

What is JSON?

JSON is based on JavaScript object literal syntax, but it is plain text and language-independent. Nearly every major programming language can parse and produce JSON.

Valid JSON has a single top-level value: either one object {...} or one array [...]—not multiple values side by side.

Basic syntax rules

Keys must be wrapped in double quotes, not single quotes.

String values also use double quotes; backslash \ escapes special characters (e.g. ", \, \n).

Separate key-value pairs and array elements with commas; no trailing comma after the last item.

Comments (// or /* */) are not allowed, nor are JavaScript-only values like undefined, NaN, or Infinity.

Numbers may be integers or floats; leading zeros (e.g. 007) and hex notation are not permitted. Booleans must be lowercase true and false.

Six data types

JSON supports exactly six types: string, number, boolean, null, object, and array. Here is a simple example with each:

{
  "name": "Alice",
  "age": 30,
  "active": true,
  "score": null
}

Strings and escaping

Strings are the most common type and must use double quotes. Use \ to escape newlines, quotes, or backslashes inside the value. JSON uses UTF-8 and supports any Unicode text; save .json files as UTF-8 (no BOM recommended).

Common escapes: \n (newline), \t (tab), \\ (backslash), \" (quote), \uXXXX (Unicode code point). Example:

{
  "message": "Hello\nWorld",
  "quote": "He said \"Hi\"",
  "path": "C:\\Users\\data",
  "emoji": "你好 🎉",
  "unicode": "\u0041"
}

Numbers, booleans, and null

Numbers include integers, decimals, negatives, and scientific notation (e.g. 1.5e10). Booleans are true and false only. null means an empty value—JSON has no undefined.

Example:

{
  "count": 42,
  "price": 19.99,
  "negative": -1,
  "scientific": 1.5e10,
  "flag": true,
  "disabled": false,
  "empty": null
}

Empty arrays, objects, and strings

[] is an empty array, {} an empty object, and "" an empty string. APIs often use null, [], or {} for “no data”—the meaning depends on context.

{
  "tags": [],
  "meta": {},
  "note": ""
}

Objects

Objects use curly braces {} with zero or more key:value pairs. Keys are always strings; values can be any JSON type.

{
  "user": {
    "id": 1001,
    "email": "alice@example.com"
  }
}

Arrays

Arrays use square brackets [] with ordered elements indexed from 0. Elements may be any JSON type and can be mixed in one array.

An array can also be the top-level JSON value, for example when an API returns a list:

{
  "tags": ["json", "tutorial", "web"],
  "scores": [95, 88, 72]
}

[
  { "id": 1, "name": "Alice" },
  { "id": 2, "name": "Bob" }
]

Nested structures

Real-world JSON is often deeply nested: objects inside arrays, arrays inside objects. API responses, package.json, and CI configs are typical examples.

{
  "project": "QyCreate JSON",
  "version": 1,
  "features": ["format", "validate", "minify"],
  "settings": {
    "indent": 2,
    "theme": "light"
  },
  "contributors": [
    { "name": "Alice", "role": "author" },
    { "name": "Bob", "role": "reviewer" }
  ]
}

JSON vs JavaScript

JSON is a data format, not executable JavaScript. Syntax looks similar, but JSON is stricter: quoted keys, no comments, functions, Date objects, or undefined.

Use JSON.parse() to parse a JSON string and JSON.stringify() to serialize objects. Formats like JSON5 add comments or trailing commas—they are extensions, not standard JSON.

Common mistakes and fixes

Typical errors include unquoted keys, single quotes, trailing commas, and JavaScript-style comments. Compare below:

{
  name: "Alice",
  "items": [1, 2, 3,],
}

{
  "name": "Alice",
  "items": [1, 2, 3]
}

Practice with this tool

Open the home-page editor and paste JSON, or upload a .json / .txt file up to 4 MB. Not sure where to start? Click Load example.

Format beautifies with 2-space indentation; Minify removes whitespace for a compact string. Formatted indentation and syntax highlighting make nested data easier to read.

When JSON is invalid, the editor shows line and column numbers plus fix hints. Undo and redo support editing; copy or download the result as .json when done.

All processing runs locally in your browser—nothing is uploaded, so it is safe for tokens and sensitive API payloads.