JSON vs JavaScript Objects: The Differences That Cause Bugs

JSON is text; a JavaScript object is a runtime value

JSON is a language-independent text representation. A JavaScript object exists in memory and can contain language features that have no JSON representation. Their similar braces make them easy to confuse, but the two are not interchangeable.

JSON requires double-quoted names and strings

JavaScript object literals can use unquoted identifier-like keys and single-quoted strings. Standard JSON requires property names and string values to use double quotes.

JavaScript object literal:
{ name: 'Ada', active: true }

Valid JSON:
{"name":"Ada","active":true}

JavaScript has values JSON cannot represent directly

undefined, functions, symbols, BigInt and special numeric values such as NaN and Infinity are JavaScript concepts. JSON.stringify omits, transforms or rejects some of them depending on where they appear.

Comments and trailing commas are not JSON

Modern JavaScript allows comments and trailing commas in many contexts. Standard JSON does not. Configuration copied from JavaScript or TypeScript source can therefore fail a strict JSON parser even when it looks familiar.

Serialize instead of hand-building JSON text

JSON.stringify handles nested values, quotes and backslashes consistently. String concatenation becomes fragile as soon as user data contains punctuation that itself needs escaping.

const value = { name: 'Ada', note: 'She said \"hello\"' };
const json = JSON.stringify(value);

Parse only when you actually have JSON text

JSON.parse is for strings containing JSON text. If a framework has already returned a JavaScript object, parsing again is unnecessary. Passing undefined or an already-parsed object is a common source of confusing errors.