What is JSON? A Beginner's Guide to JavaScript Object Notation

ยท 8 min read

If you've done any web development, you've probably run into JSON. It's everywhere. APIs send it back. Config files use it. Even your package.json file is, well, JSON. But what actually is it, and why did it become the go to format for pretty much everything?

Let's break it down without the usual textbook fluff.

What JSON Actually Stands For

JSON stands for JavaScript Object Notation. Don't let the name fool you though. While it was inspired by JavaScript object syntax, JSON is language independent. You can use it with Python, Java, Go, Ruby, PHP... basically any language you can think of has a way to read and write JSON.

At its core, JSON is just a text format for storing and exchanging data. It's human readable (unlike binary formats) and machines can parse it quickly. That's the whole point really.

Why JSON Exists (A Bit of History)

Back in the early 2000s, XML was king. Everything used XML. Web services, config files, data exchange, you name it. But XML had a problem: it was verbose. Really verbose. Look at this:

<person>
  <name>Alice</name>
  <age>28</age>
  <email>alice@example.com</email>
</person>

Now here's the same data in JSON:

{
  "name": "Alice",
  "age": 28,
  "email": "alice@example.com"
}

See the difference? Less typing, easier to read, smaller file size. Douglas Crockford (a JavaScript architect at Yahoo) popularized JSON around 2001, and developers quickly adopted it because it just made sense.

The format was formally specified in 2006, and by the 2010s it had basically replaced XML for most web APIs. These days, if you're building a REST API, you're almost certainly using JSON.

JSON Syntax Basics

JSON has a few simple rules. Once you get them, you'll never forget them. Here's the quick version:

Objects use curly braces

An object is a collection of key value pairs wrapped in {}. Keys must be strings (in double quotes), and values can be various types.

{
  "name": "Bob",
  "active": true
}

Arrays use square brackets

Arrays are ordered lists of values wrapped in [].

["apple", "banana", "cherry"]

Keys must be double quoted

This trips up JavaScript developers all the time. In JS objects, you can skip quotes on keys. In JSON, you can't.

// Wrong (this isn't valid JSON)
{ name: "Alice" }

// Right
{ "name": "Alice" }

No trailing commas

Another gotcha. JavaScript lets you have a comma after the last item. JSON does not.

// Wrong
{
  "name": "Alice",
  "age": 28,
}

// Right
{
  "name": "Alice",
  "age": 28
}

No comments allowed

Yep, JSON doesn't support comments. This is annoying for config files, which is why some tools (like VS Code) support "JSON with Comments" (jsonc) as a separate format. But standard JSON? No comments.

Data Types You Can Use

JSON supports six data types. That's it. No more, no less.

1. Strings

Text wrapped in double quotes. Must use double quotes, single quotes won't work.

"Hello, world!"

2. Numbers

Integers or floating point. No quotes around them. JSON doesn't distinguish between int and float.

42
3.14
-17

3. Booleans

Either true or false. Lowercase, no quotes.

true
false

4. Null

Represents "nothing" or "empty". Lowercase, no quotes.

null

5. Arrays

Ordered lists that can contain any mix of the other types.

[1, "two", true, null]

6. Objects

Key value collections. Values can be any type, including nested objects and arrays.

{
  "user": {
    "name": "Alice",
    "roles": ["admin", "editor"]
  }
}

What JSON doesn't support: dates, functions, undefined, binary data, special number values like NaN or Infinity. If you need to store a date, you typically use an ISO 8601 string like "2026-01-28T10:30:00Z".

Real World Examples

Let's look at some JSON you'll actually encounter in the wild.

API Response

When you call a REST API, you usually get back JSON like this:

{
  "status": "success",
  "data": {
    "user": {
      "id": 12345,
      "username": "alice_dev",
      "email": "alice@example.com",
      "created_at": "2024-03-15T08:00:00Z"
    }
  },
  "meta": {
    "request_id": "abc-123-xyz"
  }
}

Package.json (Node.js)

Every Node.js project has one of these:

{
  "name": "my-awesome-app",
  "version": "1.0.0",
  "description": "Does awesome things",
  "main": "index.js",
  "scripts": {
    "start": "node index.js",
    "test": "jest"
  },
  "dependencies": {
    "express": "^4.18.2"
  }
}

Configuration File

Many tools use JSON for settings:

{
  "editor.fontSize": 14,
  "editor.tabSize": 2,
  "files.autoSave": "afterDelay",
  "terminal.integrated.shell.osx": "/bin/zsh"
}

JSON vs the Alternatives

JSON isn't the only game in town. Here's how it stacks up against other common formats:

JSON vs XML

XML is more verbose but supports things like attributes and namespaces. It's still used in enterprise systems, SOAP APIs, and some config files. JSON won the web API battle though.

JSON vs YAML

YAML is popular for config files (think Docker Compose, Kubernetes, GitHub Actions). It supports comments and is arguably more readable for humans. But it's also more complex and has some gotchas with indentation. For data exchange between systems, JSON is usually preferred.

JSON vs TOML

TOML is gaining traction for config files (Rust's Cargo uses it). It's simpler than YAML and supports comments. Still pretty niche compared to JSON though.

Want a deeper dive? Check out our guide on JSON vs XML vs YAML.

Common Mistakes to Avoid

Here are the errors I see most often when people work with JSON:

  • Single quotes instead of double: JSON requires double quotes for strings and keys. 'name' is invalid.
  • Trailing commas: That extra comma after the last item will break your JSON parser.
  • Unquoted keys: Unlike JavaScript objects, { name: "value" } is not valid JSON.
  • Comments: You can't add // comments in JSON files. Use a different format if you need them.
  • Using undefined: JSON has null, not undefined.

If you're getting parse errors, run your JSON through a validator or use our JSON cleaner tool to spot issues.

Where to Go From Here

Now that you know what JSON is, here are some logical next steps: