JSON Formatter JavaScript — JSON.stringify()

·Front-end & Node.js Developer·Granskad avMarcus Webb·Publicerad

Använd det kostnadsfria JSON Formatter & Beautifier direkt i webbläsaren — ingen installation krävs.

Prova JSON Formatter & Beautifier online →

När jag felsöker API-svar i Node.js är en vägg av minifierad JSON det första som saktar ner mig — ett enda anrop till JSON.stringify(data, null, 2) och strukturen blir omedelbart läsbar. För att formatera JSON i JavaScript behöver du inget utöver runtime-miljön: JSON.stringify är inbyggt i varje webbläsare och Node.js-miljö, ingen installation krävs. Om du bara behöver ett snabbt resultat utan att skriva kod gör ToolDecks JSON Formatter det direkt. Den här guiden täcker allt praktiskt: parametern space, replacer-arrayer och funktioner, hantering av Date, BigInt och cirkulära referenser, läsning och skrivning av JSON-filer i Node.js (18+), CLI-formatering och biblioteket fast-json-stringify för produktionsserialisering.

  • JSON.stringify(data, null, 2) är inbyggt i varje webbläsare och Node.js — ingen installation krävs.
  • Parametern replacer accepterar en array (nyckel-whitelist) eller en funktion (transformera värden) — använd den för att maskera känsliga fält.
  • Date-objekt serialiseras automatiskt via toJSON() → ISO 8601-sträng; BigInt kastar TypeError och kräver en anpassad replacer.
  • Cirkulära referenser kastar TypeError — fixa med ett WeakSet i en replacer-funktion, eller använd biblioteket flatted.
  • För CLI-formatering, använd node -p "JSON.stringify(require('./file.json'),null,2)" — inga extra verktyg behövs.

Vad är JSON-formatering?

JSON-formatering (även kallat pretty-printing) omvandlar en kompakt, minifierad JSON-sträng till ett för människor läsbart format med konsekvent indragning och radbrytningar. Den underliggande datan är identisk — det är bara blanktecken som ändras. Kompakt JSON är optimalt för nätverksöverföring där varje byte räknas; formaterad JSON är optimalt för felsökning, kodgranskning och logginspekting. JavaScripts JSON.stringify() hanterar båda i ett enda anrop genom att växla parametern space.

Before · json
After · json
{"orderId":"ord_8f2a91bc","status":"shipped","items":[{"sku":"HDMI-4K-2M","qty":2,"unitPrice":12.99}],"total":25.98}
{
  "orderId": "ord_8f2a91bc",
  "status": "shipped",
  "items": [
    {
      "sku": "HDMI-4K-2M",
      "qty": 2,
      "unitPrice": 12.99
    }
  ],
  "total": 25.98
}

JSON.stringify() — Den inbyggda formateraren

JSON.stringify() är en global funktion i varje JavaScript-miljö — webbläsare, Node.js, Deno, Bun — utan import. Det tredje argumentet, space, styr indragningen: skicka ett nummer för så många mellanslag per nivå, eller strängen '\t' för tabbar. Utelämnar du det (eller skickar null) får du kompakt utdata på en rad.

JavaScript — minimal working example
const serverConfig = {
  host: "api.payments.internal",
  port: 8443,
  workers: 4,
  tls: { enabled: true, cert: "/etc/ssl/certs/api.pem" },
  rateLimit: { requestsPerMinute: 1000, burst: 50 }
}

console.log(JSON.stringify(serverConfig, null, 2))
// {
//   "host": "api.payments.internal",
//   "port": 8443,
//   "workers": 4,
//   "tls": {
//     "enabled": true,
//     "cert": "/etc/ssl/certs/api.pem"
//   },
//   "rateLimit": {
//     "requestsPerMinute": 1000,
//     "burst": 50
//   }
// }

Parametern space accepterar antingen ett nummer (1–10 mellanslag) eller en sträng. Att använda ett tabbtecken ger utdata som många editorer och diff-verktyg föredrar. Du kan också kombinera alla tre parametrar — här är ett mönster jag använder när jag skriver formaterad JSON till konfigurationsfiler:

JavaScript — space variations
const telemetryEvent = {
  eventId: "evt_3c7f9a2b",
  service: "checkout-api",
  severity: "warn",
  latencyMs: 342,
  region: "eu-west-1",
  tags: ["payment", "timeout", "retry"]
}

// 2-mellanslags indragning (vanligast i JS-projekt)
JSON.stringify(telemetryEvent, null, 2)

// Tabb-indragning (föredras av vissa linters och konfigurationsverktyg)
JSON.stringify(telemetryEvent, null, '\t')

// Kompakt — inga blanktecken (för nätverksöverföring)
JSON.stringify(telemetryEvent)
// {"eventId":"evt_3c7f9a2b","service":"checkout-api",...}
Obs:Värden av typen undefined, funktioner och Symbol utelämnas tyst från utdata. Om ett egenskapsvärde är undefined kommer nyckeln inte att synas i den serialiserade strängen alls — det är en vanlig felkälla när man loggar objekt med valfria fält.

Replacer-funktioner — Filtrera och transformera utdata

Det andra argumentet till JSON.stringify() är replacer. Det finns i två former: en array som whitelistar specifika nycklar, eller en funktion som anropas för varje nyckel/värde-par och kan filtrera, transformera eller redigera värden. Jag använder array-formen när jag snabbt behöver en delmängd, och funktionsformen när jag behöver maskera känsliga data innan loggning.

Array-replacer — Whitelist specifika nycklar

JavaScript — array replacer
const order = {
  orderId: "ord_8f2a91bc",
  customer: {
    id: "usr_4421",
    email: "e.lindqvist@exempel.se",
    passwordHash: "bcrypt:$2b$12$XKzV..."
  },
  items: [{ sku: "HDMI-4K-2M", qty: 2, unitPrice: 12.99 }],
  createdAt: "2026-03-10T14:22:00Z"
}

// Inkludera bara säkra fält i loggutdata
const safeLog = JSON.stringify(order, ["orderId", "items", "createdAt"], 2)
// {
//   "orderId": "ord_8f2a91bc",
//   "items": [{ "sku": "HDMI-4K-2M", "qty": 2, "unitPrice": 12.99 }],
//   "createdAt": "2026-03-10T14:22:00Z"
// }
// passwordHash och customer.email är exkluderade

Funktions-replacer — Transformera värden

JavaScript — function replacer
const auditRecord = {
  requestId: "req_7d2e91",
  user: { id: "usr_4421", email: "e.lindqvist@exempel.se", apiKey: "sk-live-eKx9..." },
  action: "update_billing",
  timestamp: new Date("2026-03-10T14:22:00Z"),
  durationMs: 87
}

function safeReplacer(key, value) {
  // Redigera fält som ser ut som hemligheter eller personuppgifter
  if (key === "apiKey") return "[REDACTED]"
  if (key === "email") return value.replace(/(?<=.{2}).+(?=@)/, "***")
  return value
}

console.log(JSON.stringify(auditRecord, safeReplacer, 2))
// {
//   "requestId": "req_7d2e91",
//   "user": { "id": "usr_4421", "email": "e.***@exempel.se", "apiKey": "[REDACTED]" },
//   "action": "update_billing",
//   "timestamp": "2026-03-10T14:22:00.000Z",
//   "durationMs": 87
// }
Obs:Replacer-funktionen anropas med this inställt på objektet som innehåller den aktuella nyckeln. Det allra första anropet skickar en tom sträng som nyckel och hela värdet som serialiseras — returnera det oförändrat för att fortsätta med normal serialisering.

Hantering av icke-serialiserbara typer

Inte alla JavaScript-värden mappas snyggt till JSON. Att känna till hur varje typ beter sig förhindrar tyst dataförlust och oväntade körtidsfel i produktionskod.

Date — Automatiskt via toJSON()

Objekt av typen Date implementerar en metod toJSON() som returnerar en ISO 8601-sträng. JSON.stringify() anropar toJSON() automatiskt innan serialisering, så ingen anpassad hantering krävs.

JavaScript — Date serialization
const webhook = {
  eventType: "payment.succeeded",
  occurredAt: new Date("2026-03-10T14:22:00Z"),
  processedAt: new Date()
}

JSON.stringify(webhook, null, 2)
// {
//   "eventType": "payment.succeeded",
//   "occurredAt": "2026-03-10T14:22:00.000Z",
//   "processedAt": "2026-03-10T14:22:01.347Z"
// }

// Alla objekt med en toJSON()-metod behandlas likadant:
const custom = { toJSON: () => "custom-value", hidden: 42 }
JSON.stringify(custom) // '"custom-value"'

Custom Classes — Implementera toJSON()

Alla klasser kan implementera en metod toJSON() och JSON.stringify() anropar den automatiskt vid serialisering. Det är renare än en global replacer för domäntyper som förekommer i hela kodbasen.

JavaScript — custom toJSON()
class Money {
  constructor(amount, currency) {
    this.amount = amount
    this.currency = currency
  }
  toJSON() {
    // Anropas automatiskt av JSON.stringify
    return { amount: this.amount, currency: this.currency, formatted: `${this.currency} ${this.amount.toFixed(2)}` }
  }
}

class OrderId {
  constructor(id) { this.id = id }
  toJSON() { return this.id }  // Serialisera som enkel sträng
}

const invoice = {
  invoiceId: new OrderId('inv_8f2a91bc'),
  subtotal: new Money(199.00, 'SEK'),
  tax:      new Money(15.92, 'SEK'),
  issuedAt: new Date('2026-03-10T14:22:00Z')
}

JSON.stringify(invoice, null, 2)
// {
//   "invoiceId": "inv_8f2a91bc",
//   "subtotal": { "amount": 199, "currency": "SEK", "formatted": "SEK 199.00" },
//   "tax": { "amount": 15.92, "currency": "SEK", "formatted": "SEK 15.92" },
//   "issuedAt": "2026-03-10T14:22:00.000Z"
// }
Obs:toJSON() har prioritet över replacer-funktionen. Om båda finns körs toJSON() först — replacer tar emot det redan konverterade värdet, inte den ursprungliga klassinstansen.

BigInt — TypeError utan replacer

JavaScript — BigInt replacer
// Det här kastar: TypeError: Do not know how to serialize a BigInt
// JSON.stringify({ sessionId: 9007199254741234n })

// Lösning: konvertera BigInt till sträng i replacer
function bigIntReplacer(_key, value) {
  return typeof value === 'bigint' ? value.toString() : value
}

const metrics = {
  requestCount: 9007199254741234n,  // överskrider Number.MAX_SAFE_INTEGER
  service: "ingestion-worker",
  region: "eu-north-1"
}

JSON.stringify(metrics, bigIntReplacer, 2)
// {
//   "requestCount": "9007199254741234",
//   "service": "ingestion-worker",
//   "region": "eu-north-1"
// }

Cirkulära referenser — TypeError utan Seen Set

JavaScript — circular reference replacer
// Det här kastar: TypeError: Converting circular structure to JSON
// const node = { id: "n1" }; node.self = node; JSON.stringify(node)

// Lösning: spåra sedda objekt med ett WeakSet
function circularReplacer() {
  const seen = new WeakSet()
  return function (_key, value) {
    if (typeof value === 'object' && value !== null) {
      if (seen.has(value)) return '[Circular]'
      seen.add(value)
    }
    return value
  }
}

const parent = { id: "node_parent", label: "root" }
const child  = { id: "node_child", parent }
parent.child = child  // cirkulär

JSON.stringify(parent, circularReplacer(), 2)
// {
//   "id": "node_parent",
//   "label": "root",
//   "child": { "id": "node_child", "parent": "[Circular]" }
// }

// Alternativt: npm install flatted
// import { stringify } from 'flatted'
// stringify(parent)  // hanterar cirkulära refs nativt

Parameterreferens för JSON.stringify()

Alla tre parametrar stöds väl i varje modern JavaScript-runtime. Standardvärdena producerar kompakt JSON på en rad — skicka parametrar explicit för läsbar utdata.

Parameter
Type
Default
Beskrivning
value
any
Värdet att serialisera. Objekt, arrayer, strängar, nummer, booleaner och null stöds nativt.
replacer
function | Array<string | number> | null
null
Filtrera eller transformera nyckel/värde-par. Array = whitelist av nycklar att inkludera. Funktion = anropas för varje nyckel/värde-par.
space
number | string | null
null
Indragning. Nummer = mellanslag per nivå (max 10). Sträng = bokstavlig indragning (t.ex. "\t"). null eller 0 = kompakt utdata.

Formatera JSON från en fil och API-svar

I Node.js (18+) behöver du ofta formatera om en JSON-konfigurationsfil eller pretty-printa ett API-svar för felsökning. Båda mönstren använder samma tvåstegsansats: parsa rå text med JSON.parse(), sedan serialisera om med JSON.stringify().

Läsa och skriva om en JSON-konfigurationsfil

Node.js 18+ — reformat a JSON file (ESM)
import { readFileSync, writeFileSync } from 'fs'

try {
  const raw = readFileSync('./config/database.json', 'utf8')
  const config = JSON.parse(raw)
  writeFileSync('./config/database.json', JSON.stringify(config, null, 2))
  console.log('Konfigurationen har formaterats om')
} catch (err) {
  console.error('Misslyckades att formatera om konfigurationen:', err.message)
  // JSON.parse kastar SyntaxError om filen innehåller ogiltig JSON
  // readFileSync kastar ENOENT om filen inte existerar
}

Asynkron omformatering (fs/promises)

Node.js 18+ — async file reformat
import { readFile, writeFile } from 'fs/promises'

async function reformatJson(filePath) {
  const raw = await readFile(filePath, 'utf8')
  const parsed = JSON.parse(raw)
  const formatted = JSON.stringify(parsed, null, 2)
  await writeFile(filePath, formatted, 'utf8')
  return { keys: Object.keys(parsed).length }
}

// Användning
const { keys } = await reformatJson('./config/feature-flags.json')
console.log(`Formaterade om ${keys} toppnivånycklar`)

Pretty Print JSON från ett fetch()-svar

När du bygger eller felsöker en API-klient i Node.js 18+ eller webbläsaren är pretty-printing av svarskroppen det snabbaste sättet att förstå vad servern returnerade. Standardmönstret är response.json() (parsat objekt) in i JSON.stringify(). Om du behöver råsträngen först — till exempel för att beräkna en hash eller logga den verbatim — använd response.text() och sedan JSON.parse().

JavaScript — fetch + pretty print (Node.js 18+ or browser)
// Mönster 1: response.json() → pretty print
async function debugEndpoint(url) {
  const res = await fetch(url, {
    headers: { Authorization: `Bearer ${process.env.API_TOKEN}` }
  })
  if (!res.ok) throw new Error(`HTTP ${res.status}: ${res.statusText}`)

  const data = await res.json()
  console.log(JSON.stringify(data, null, 2))
}

await debugEndpoint('https://api.stripe.com/v1/charges?limit=3')
JavaScript — response.text() when you need the raw string first
// Mönster 2: response.text() → parse → format
// Användbart när du vill logga både råsvaret och pretty-printat
async function inspectRawResponse(url) {
  const res = await fetch(url)
  const raw = await res.text()

  console.log('Råsvarets längd:', raw.length)
  try {
    const parsed = JSON.parse(raw)
    console.log('Formaterat:')
    console.log(JSON.stringify(parsed, null, 2))
  } catch {
    console.error('Svaret är inte giltig JSON:', raw.slice(0, 200))
  }
}

Pretty Printing från kommandoraden

Node.js har tillräcklig kapacitet för att pretty-printa JSON från terminalen utan extra verktyg. Dessa one-liners är användbara i CI-skript, driftsättningspipelines och shell-alias. För ännu snabbare interaktiv användning, installera jq — de-facto-standard för JSON-manipulation på kommandoraden.

bash — pretty print a JSON file with Node.js
# Pretty-printa package.json med node -p (print)
node -p "JSON.stringify(require('./package.json'), null, 2)"

# Pretty-printa från stdin (pipe-vänligt, fungerar i CI)
echo '{"port":3000,"env":"production"}' | node -e "
  const d = require('fs').readFileSync(0, 'utf8')
  console.log(JSON.stringify(JSON.parse(d), null, 2))
"

# Pretty-printa ett sparat API-svar
cat api-response.json | node -e "
  process.stdin.setEncoding('utf8')
  let s = ''
  process.stdin.on('data', c => s += c)
  process.stdin.on('end', () => console.log(JSON.stringify(JSON.parse(s), null, 2)))
"
bash — universal alternatives
# Python-fallback (förinstallerat på macOS och de flesta Linux-distributioner)
cat api-response.json | python3 -m json.tool

# jq — snabbast och mest funktionsrikt (brew install jq / apt install jq)
cat api-response.json | jq .

# jq — pretty-printa och filtrera i ett steg
cat api-response.json | jq '.data.users[] | {id, email}'
Obs:När Node.js körs i ESM-läge (t.ex. med "type": "module" i package.json) är require() inte tillgängligt i one-liners. Använd --input-type=module och fs.readFileSync istället, eller växla till node -e med ett CommonJS-snippet som visas ovan.

Om du inte är i terminalen alls — klistrar in ett Postman-svar eller en loggfil — låter ToolDecks JSON Formatter dig klistra in, formatera och kopiera i ett steg med syntaxmarkering och inbyggd validering.

Högpresterande alternativ — fast-json-stringify

fast-json-stringify genererar en dedikerad serialiseringsfunktion från ett JSON Schema. Eftersom det känner till dataformens utseende i förväg kan det hoppa över typkontroller och använda strängkonkatenering istället för rekursiv traversering — benchmarks visar typiskt 2–5× genomströmningsförbättring jämfört med JSON.stringify() för stora, repetitiva nyttolaster. Jag använder det i högfrekventa API-routes där serialiseringskostnader syns i profileringstracerna.

bash
npm install fast-json-stringify
JavaScript — fast-json-stringify for telemetry events
import fastJson from 'fast-json-stringify'

const serializeTelemetryEvent = fastJson({
  title: 'TelemetryEvent',
  type: 'object',
  properties: {
    eventId:   { type: 'string' },
    service:   { type: 'string' },
    severity:  { type: 'string', enum: ['info', 'warn', 'error'] },
    latencyMs: { type: 'integer' },
    timestamp: { type: 'string' },
    region:    { type: 'string' }
  },
  required: ['eventId', 'service', 'severity', 'latencyMs', 'timestamp']
})

const event = {
  eventId:   'evt_3c7f9a2b',
  service:   'checkout-api',
  severity:  'warn',
  latencyMs: 342,
  timestamp: new Date().toISOString(),
  region:    'eu-north-1'
}

const json = serializeTelemetryEvent(event)
// '{"eventId":"evt_3c7f9a2b","service":"checkout-api","severity":"warn",...}'
Obs:fast-json-stringify är designat för produktionsserialisering av strukturerad data — det producerar alltid kompakt utdata (ingen pretty-printing). För läsbar utdata under utveckling, använd JSON.stringify(data, null, 2) som vanligt.

Terminalutdata med syntaxmarkering

Node.js inbyggda util.inspect() producerar färgad, för människor läsbar utdata optimerad för terminalvisning. Den hanterar cirkulära referenser och BigInt nativt och renderar rekursivt kapslade objekt till valfritt djup. Utdata är inte giltig JSON — den använder JavaScript-syntax, vilket gör det idealiskt för Node.js-felsökningsskript men olämpligt för API-svar eller filutdata.

Node.js 18+ — util.inspect with colors
import { inspect } from 'util'

const payload = {
  requestId: "req_7d2e91",
  user: { id: "usr_4421", roles: ["admin", "billing"] },
  metadata: { ipAddress: "203.0.113.42", userAgent: "Mozilla/5.0" },
  createdAt: new Date()
}

// depth: null → expandera alla kapslade nivåer; colors: true → ANSI-terminalfärger
console.log(inspect(payload, { colors: true, depth: null }))
Varning:Använd inte util.inspect() för JSON som skrivs till filer, skickas över nätverket eller lagras i en databas. Dess utdata är inte giltig JSON och orsakar parsningsfel i alla nedströms system som anropar JSON.parse() på det. Reservera det enbart för interaktiv terminalfelsökning.

Arbeta med stora JSON-filer

JSON.parse() läser in hela filen i minnet innan parsning — bra för små nyttolaster, men opraktiskt för filer över 50–100 MB som databasexporter, applikationsloggar eller analysbatcher. För dessa fall låter Node.js Streams och biblioteket stream-json dig bearbeta poster en i taget utan att överbelasta heapen.

Strömmande parsning med stream-json

bash
npm install stream-json
Node.js 18+ — stream-json for large arrays
import { pipeline } from 'stream/promises'
import { createReadStream } from 'fs'
import { parser } from 'stream-json'
import { streamArray } from 'stream-json/streamers/StreamArray.js'

// events.json = array med miljontals objekt — läses aldrig in helt i minnet
await pipeline(
  createReadStream('./events.json'),
  parser(),
  streamArray(),
  async function* (source) {
    for await (const { value: event } of source) {
      if (event.severity === 'error') {
        console.log(JSON.stringify(event, null, 2))
      }
    }
  }
)

NDJSON / JSON Lines — Inga extra beroenden

NDJSON (Newline Delimited JSON) lagrar ett JSON-objekt per rad och är vanligt i Kafka-exporter, BigQuery-utdata och strukturerade loggpipelines. Node.js inbyggda readline hanterar det utan tredjepartspaket.

Node.js 18+ — NDJSON with readline
import { createReadStream } from 'fs'
import { createInterface } from 'readline'

// Format: ett JSON-objekt per rad (loggar, Kafka-exporter, BigQuery)
const rl = createInterface({
  input: createReadStream('./logs.ndjson'),
  crlfDelay: Infinity
})

for await (const line of rl) {
  if (!line.trim()) continue
  const entry = JSON.parse(line)
  if (entry.level === 'error') {
    console.log(JSON.stringify(entry, null, 2))
  }
}
Obs:Växla från JSON.parse() till strömning när din JSON-fil överstiger 50–100 MB eller när du bearbetar en obegränsad ström (Kafka, loggpipeline). För NDJSON / JSON Lines, använd readline — det kräver inga extra beroenden.

Vanliga misstag

Dessa fyra misstag dyker upp gång på gång i kodgranskningar och produktionsbuggsrapporter. Varje ett involverar ett subtilt beteende hos JSON.stringify() som är lätt att missa och svårt att felsöka i efterhand.

Glömmer att undefined-värden tyst tas bort

Problem: Objektegenskaper med värdet undefined utelämnas helt från JSON-utdata — utan varning eller fel. Det orsakar osynlig dataförlust när objektet har valfria fält.

Lösning: Använd null för avsiktligt saknade värden som måste synas i den serialiserade utdan. Reservera undefined enbart för fält som ska uteslutas från JSON.

Before · JavaScript
After · JavaScript
const userProfile = {
  userId: "usr_4421",
  displayName: "Erik Lindqvist",
  avatarUrl: undefined,   // försvinner tyst
  bio: undefined          // försvinner tyst
}

JSON.stringify(userProfile, null, 2)
// { "userId": "usr_4421", "displayName": "Erik Lindqvist" }
// avatarUrl och bio är borta — ingen varning
const userProfile = {
  userId: "usr_4421",
  displayName: "Erik Lindqvist",
  avatarUrl: null,   // avsiktligt saknas — syns i utdata
  bio: null          // avsiktligt saknas — syns i utdata
}

JSON.stringify(userProfile, null, 2)
// {
//   "userId": "usr_4421",
//   "displayName": "Erik Lindqvist",
//   "avatarUrl": null,
//   "bio": null
// }
BigInt kastar TypeError

Problem: Att skicka ett BigInt-värde till JSON.stringify() kastar TypeError vid körning. Det är en hård krasch, inte tyst utelämnande — det uppstår i produktion om något numeriskt fält överstiger Number.MAX_SAFE_INTEGER.

Lösning: Använd en replacer-funktion som konverterar BigInt-värden till strängar innan serialisering. Alternativt, konvertera BigInt till sträng eller Number i datalagret innan det skickas till JSON.stringify.

Before · JavaScript
After · JavaScript
const session = {
  sessionId: 9007199254741234n,  // BigInt-literal
  userId: "usr_4421",
  startedAt: "2026-03-10T14:00:00Z"
}

JSON.stringify(session, null, 2)
// Uncaught TypeError: Do not know how to serialize a BigInt
function bigIntReplacer(_key, value) {
  return typeof value === 'bigint' ? value.toString() : value
}

const session = {
  sessionId: 9007199254741234n,
  userId: "usr_4421",
  startedAt: "2026-03-10T14:00:00Z"
}

JSON.stringify(session, bigIntReplacer, 2)
// {
//   "sessionId": "9007199254741234",
//   "userId": "usr_4421",
//   "startedAt": "2026-03-10T14:00:00Z"
// }
Krasch på grund av cirkulära referenser

Problem: Objekt som refererar till sig själva — vanliga i DOM-träd, länkade listor och vissa ORM-resultat — kastar TypeError när de skickas till JSON.stringify(). Felet inträffar inte förrän vid serialisering, ofta långt från där den cirkulära referensen skapades.

Lösning: Använd en replacer-funktion med ett WeakSet för att detektera och ersätta cirkulära referenser, eller installera biblioteket flatted som ett drop-in-alternativ som hanterar cirkulära strukturer nativt.

Before · JavaScript
After · JavaScript
const dept = { id: "dept_eng", name: "Engineering" }
const team = { id: "team_frontend", dept }
dept.teams = [team]  // cirkulärt: dept → team → dept

JSON.stringify(dept, null, 2)
// Uncaught TypeError: Converting circular structure to JSON
import { stringify } from 'flatted'  // npm install flatted

const dept = { id: "dept_eng", name: "Engineering" }
const team = { id: "team_frontend", dept }
dept.teams = [team]

// flatted hanterar cirkulära refs — obs: utdata är i flatted-format, inte standard-JSON
stringify(dept)

// Eller använd WeakSet-baserad replacer för standard-JSON-utdata:
function circularReplacer() {
  const seen = new WeakSet()
  return (_key, value) => {
    if (typeof value === 'object' && value !== null) {
      if (seen.has(value)) return '[Circular]'
      seen.add(value)
    }
    return value
  }
}
JSON.stringify(dept, circularReplacer(), 2)
Använda space > 10 (begränsas tyst)

Problem: Att skicka ett space-värde större än 10 till JSON.stringify() kastar inget fel — värdet begränsas tyst till 10. Utvecklare som förväntar sig 20 mellanslags indragning för djup kapsling får bara 10, vilket leder till oväntat formatering i genererade filer.

Lösning: Maximal indragning är 10 mellanslag. För djupa strukturer, föredra 2-mellanslags indragning (den vanligaste konventionen i JavaScript-projekt) och förlita dig på hopfällbara editorer för navigering.

Before · JavaScript
After · JavaScript
const deepConfig = { server: { tls: { certs: { primary: "/etc/ssl/api.pem" } } } }

// Förväntar 20-mellanslags indragning — men space begränsas till 10
JSON.stringify(deepConfig, null, 20)
// Samma utdata som JSON.stringify(deepConfig, null, 10)
// Inget fel, ingen varning — tyst avkortad
const deepConfig = { server: { tls: { certs: { primary: "/etc/ssl/api.pem" } } } }

// Använd 2 (de flesta projekt) eller 4 mellanslag — överskrid aldrig 10
JSON.stringify(deepConfig, null, 2)
// {
//   "server": {
//     "tls": {
//       "certs": {
//         "primary": "/etc/ssl/api.pem"
//       }
//     }
//   }
// }

JSON.stringify vs. Alternativ — Snabb jämförelse

Olika situationer kräver olika verktyg. JSON.stringify med en replacer täcker de flesta produktionsscenarier utan beroenden. util.inspect är rätt val för snabb terminalfelsökning när du behöver färgad utdata och inte behöver giltig JSON. fast-json-stringify lönar sig i höggenomströmnings-routes där profilering visar serialiseringskostnader; för allt annat är overheaden av schemaunderhåll inte värd det.

Metod
Pretty Output
Valid JSON
Non-ASCII
Custom Types
Circular Refs
Installation
JSON.stringify
⚠️ via replacer
✗ (throws)
Nej
JSON.stringify + replacer
✅ full kontroll
Nej
util.inspect
✅ nativt
Nej (Node built-in)
fast-json-stringify
❌ schema-only
npm install
flatted
✗ (custom format)
✅ endast circular
npm install
jq (CLI)
N/A
N/A
System install

Vanliga frågor

Hur formaterar jag JSON i JavaScript?

Anropa JSON.stringify(data, null, 2) — det tredje argumentet styr indragningen. Skicka 2 eller 4 för mellanslag, eller "\t" för tabbar. Ingen import eller installation krävs: JSON är ett globalt objekt i varje JavaScript-miljö, inklusive webbläsare och Node.js.

JavaScript
const config = { host: "api.payments.internal", port: 8443, tls: true }
console.log(JSON.stringify(config, null, 2))
// {
//   "host": "api.payments.internal",
//   "port": 8443,
//   "tls": true
// }

Vad gör parametern `space` i JSON.stringify()?

Parametern space styr indragningen i utdata. Skicka ett nummer (1–10) för så många mellanslag per nivå, eller en sträng som "\t" för ett tabbtecken. Värden över 10 begränsas tyst till 10. Att skicka null, 0 eller utelämna parametern ger kompakt JSON på en rad.

JavaScript
const data = { service: "payments", version: 3, active: true }

JSON.stringify(data, null, 2)   // 2-mellanslags indragning
JSON.stringify(data, null, 4)   // 4-mellanslags indragning
JSON.stringify(data, null, '\t') // tabb-indragning
JSON.stringify(data)            // kompakt: {"service":"payments","version":3,"active":true}

Varför returnerar JSON.stringify() undefined för vissa värden?

JSON.stringify utelämnar tyst objektegenskaper vars värden är undefined, funktioner eller Symbols — dessa typer saknar JSON-representation. Om det toppnivåvärdet i sig är undefined returnerar funktionen undefined (inte strängen "undefined"). Använd null istället för undefined för valfria fält som måste synas i utdata.

JavaScript
const event = {
  traceId: "tr_9a2f",
  handler: () => {},        // funktion — utelämnas
  requestId: undefined,     // undefined — utelämnas
  sessionId: Symbol("s"),   // Symbol — utelämnas
  status: "ok"
}
JSON.stringify(event, null, 2)
// { "traceId": "tr_9a2f", "status": "ok" }

Hur hanterar jag Date-objekt när jag formaterar JSON?

Date-objekt har en inbyggd toJSON()-metod som returnerar en ISO 8601-sträng, så JSON.stringify hanterar dem automatiskt. Du behöver ingen anpassad replacer för datum — det serialiserade värdet blir en sträng som "2026-03-10T14:22:00.000Z".

JavaScript
const order = {
  orderId: "ord_8f2a91bc",
  placedAt: new Date("2026-03-10T14:22:00Z"),
  total: 42.98
}
JSON.stringify(order, null, 2)
// {
//   "orderId": "ord_8f2a91bc",
//   "placedAt": "2026-03-10T14:22:00.000Z",
//   "total": 42.98
// }

Hur formaterar jag en JSON-sträng (inte ett objekt) i JavaScript?

Parsa strängen med JSON.parse() först, serialisera sedan om med JSON.stringify(). De två anropen kan kedjas på en rad för snabb felsökning.

JavaScript
const raw = '{"endpoint":"/api/v2/users","timeout":30,"retry":true}'
const formatted = JSON.stringify(JSON.parse(raw), null, 2)
console.log(formatted)
// {
//   "endpoint": "/api/v2/users",
//   "timeout": 30,
//   "retry": true
// }

Kan jag använda JSON.stringify() i webbläsaren?

Ja. JSON är ett inbyggt globalt objekt i varje modern webbläsare sedan IE8 — inga script-taggar eller importer behövs. Öppna DevTools-konsolen och anropa JSON.stringify() direkt. Det fungerar identiskt med Node.js-versionen, med samma parametersignatur och samma begränsningar kring BigInt och cirkulära referenser.

JavaScript
// Fungerar i Chrome, Firefox, Safari, Edge — inga importer behövs
const payload = { userId: "usr_7b3c", action: "checkout", cart: ["SKU-001", "SKU-002"] }
copy(JSON.stringify(payload, null, 2)) // copy() är en DevTools-hjälpfunktion

JavaScript ger dig full kontroll — replacer-funktioner, anpassad toJSON(), hantering av stora filer i Node.js. När du bara behöver inspektera eller dela ett formaterat kodavsnitt är ToolDecks JSON Formatter den snabbaste vägen: klistra in din JSON och få ett formaterat, markerat resultat utan någon miljökonfiguration.

Relaterade verktyg

Finns även på:PythonGoBash
AC
Alex ChenFront-end & Node.js Developer

Alex is a front-end and Node.js developer with extensive experience building web applications and developer tooling. He is passionate about web standards, browser APIs, and the JavaScript ecosystem. In his spare time he contributes to open-source projects and writes about modern JavaScript patterns, performance optimisation, and everything related to the web platform.

MW
Marcus WebbTeknisk granskare

Marcus specialises in JavaScript performance, build tooling, and the inner workings of the V8 engine. He has spent years profiling and optimising React applications, working on bundler configurations, and squeezing every millisecond out of critical rendering paths. He writes about Core Web Vitals, JavaScript memory management, and the tools developers reach for when performance really matters.