JSON-formaterare

Vad är JSON-formatering?

JSON-formatering är processen att omvandla JSON-data till en konsekvent, människoläsbar form genom att lägga till indentering, mellanrum och radbrytningar – utan att ändra dess struktur eller innehåll. Korrekt formatering gör JSON enklare att inspektera, felsöka, dela och redigera, samtidigt som det säkerställer kompatibilitet med maskiner och mjukvaruverktyg.

JSON ignorerar per definition mellanrum utanför strängvärden. Men dåligt formaterad (eller minimerad) JSON – utan indentering eller ihoptryckt på en rad – kan vara nästan omöjlig för människor att läsa eller modifiera pålitligt.

Formatering vs. Minimering av JSON

• Formatering lägger till mellanrum, indentering och radbrytningar för tydlighet och läsbarhet.
• Minimering tar bort all onödig vitutrymme för maximal kompakthet och effektivitet vid lagring eller överföring.
• En kraftfull JSON-formaterare låter dig växla mellan dessa lägen, vilket gör det enkelt att byta mellan människovänliga och maskinoptimerade versioner efter behov.

Exempel: Minimerad vs. Formaterad JSON

{"id":"3f4b2c","user":{"name":"Dana","is_active":true},"roles":["admin","editor"],"count":7}

{
  "id": "3f4b2c",
  "user": {
    "name": "Dana",
    "is_active": true
  },
  "roles": [
    "admin",
    "editor"
  ],
  "count": 7
}

Varför formatera JSON?

• Läsbarhet: Korrekt indentering och radbrytningar gör det enklare att granska inbäddade objekt, upptäcka fel och förstå komplexa datastrukturer vid en snabb titt.
• Felsökning: Att hitta och rätta ogiltiga eller oväntade data blir mycket enklare när du visuellt kan skanna och följa nycklar, värden och nivåer.
• Samarbete: Välformaterad JSON är lättare att granska, diskutera och redigera vid kodgranskningar, dokumentation eller delade filer.
• Versionshantering: Git och andra VCS-verktyg ger mer meningsfulla skillnader med formaterad JSON, vilket gör det enklare att följa ändringar över tid.
• Efterlevnad: Många stilguider och automatiska linters (som Prettier, ESLint eller jq) kräver konsekvent formatering för tydlighet och standardisering.
• Verktygskompatibilitet: Vissa API:er, CLI:er och editorer förväntar sig formaterad indatat för enklare mänsklig interaktion eller loggning.

Hur fungerar en JSON-formaterare?

1. Parsering: Formateraren försöker först tolka din inmatning med en strikt JSON-parser. Detta steg kontrollerar syntaxens giltighet – fångar problem som saknade citattecken, avslutande kommatecken eller oescapeade tecken.
2. Snygg utskrift: När giltig datastruktur erhålls seraliseras den tillbaka som en sträng med användardefinierad indentering (vanligtvis 2 eller 4 mellanslag) och radbrytningar, vilket skapar en "snygg utskrift".

Om inmatningen inte är giltig JSON, visar formateraren ett fel eller ett hjälpsamt meddelande som anger plats och art av problemet.

Formateringsalternativ

• Indentering: Välj antal mellanslag per nivå (upp till 8).
• Sortera objektens nycklar alfabetiskt
• Använd tabbar för indentering istället för mellanslag
• Escapa icke-ASCII-tecken som Unicode
• Minimera utdata (enradig, utan mellanslag)

Vanliga problem som löses med formatering

• Enradig/Minimerad JSON: Data som returneras från API:er eller loggfiler minimeras ofta för bandbreddseffektivitet, vilket gör manuell redigering svårt. Formatering återställer läsbarheten för granskning och redigering.
• Inkonsekvent indentering: JSON från olika källor kan ha blandade tabbar, mellanslag eller ojämn indenteringsdjup. Omdesign normaliserar dessa skillnader och förbättrar tydlighet och enhetlighet.
• Stora/Inbäddade strukturer: Djupt inbäddade arrayer eller objekt (som konfigurationsfiler eller komplexa API-svar) blir hanterbara och lätta att navigera när de formateras, med kollapsbara vyer i kompatibla editorer.

Praktiskt exempel: Formatering av API-svar

Vid integration med tredjeparts-API:er (som AWS, Stripe eller Google Cloud) kompakteras svar ofta för snabbhet. Formatering av JSON-utdata gör det enklare att leta efter saknade fält, felsöka oväntade värden eller dela med kollegor.

{"amount":2500,"currency":"usd","status":"succeeded","charges":[{"id":"ch_1Gq","amount":2500}]}

{
  "amount": 2500,
  "currency": "usd",
  "status": "succeeded",
  "charges": [
    {
      "id": "ch_1Gq",
      "amount": 2500
    }
  ]
}

Så här formaterar du JSON med detta verktyg

1. Klistra in eller ladda upp din råa, minimerade eller dåligt formaterade JSON i inmatningsfältet.
2. Välj formateringsalternativ (indenteringsstorlek, sortera nycklar osv.).
3. Klicka på "Formatera" för att bearbeta din inmatning.
4. Visa eller kopiera den rena, läsbara utdata. Om fel upptäcks visas detaljerade syntaxmeddelanden för att hjälpa dig rätta JSON.

All formatering sker säkert i din webbläsare – dina data lämnar aldrig din enhet.

Kodexempel för JSON-formatering

Se hur du formaterar JSON i olika programmeringsspråk. Dessa exempel visar grundläggande formateringstekniker.

const ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}';
const pretty = JSON.stringify(JSON.parse(ugly), null, 2);
console.log(pretty);

import json
ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}'
pretty = json.dumps(json.loads(ugly), indent=2)
print(pretty)

package main
import (
  "encoding/json"
  "fmt"
)
func main() {
  ugly := []byte(`{"name":"Alice","age":30,"roles":["admin","user"]}`)
  var obj interface{}
  json.Unmarshal(ugly, &obj)
  pretty, _ := json.MarshalIndent(obj, "", "  ")
  fmt.Println(string(pretty))
}

import com.fasterxml.jackson.databind.ObjectMapper;
public class Main {
  public static void main(String[] args) throws Exception {
    String ugly = "{"name":"Alice","age":30,"roles":["admin","user"]}";
    ObjectMapper mapper = new ObjectMapper();
    Object obj = mapper.readValue(ugly, Object.class);
    String pretty = mapper.writerWithDefaultPrettyPrinter().writeValueAsString(obj);
    System.out.println(pretty);
  }
}

using System;
using Newtonsoft.Json;
class Program {
  static void Main() {
    var ugly = "{"name":"Alice","age":30,"roles":["admin","user"]}";
    var parsed = JsonConvert.DeserializeObject(ugly);
    var pretty = JsonConvert.SerializeObject(parsed, Formatting.Indented);
    Console.WriteLine(pretty);
  }
}

<?php
$ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}';
$obj = json_decode($ugly);
echo json_encode($obj, JSON_PRETTY_PRINT);

require 'json'
ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}'
pretty = JSON.pretty_generate(JSON.parse(ugly))
puts pretty

echo '{"name":"Alice","age":30,"roles":["admin","user"]}' | jq .

fn main() {
  let ugly = r#"{"name":"Alice","age":30,"roles":["admin","user"]}"#;
  let value: serde_json::Value = serde_json::from_str(ugly).unwrap();
  let pretty = serde_json::to_string_pretty(&value).unwrap();
  println!("{}", pretty);
}

import com.fasterxml.jackson.databind.ObjectMapper
fun main() {
  val ugly = "{"name":"Alice","age":30,"roles":["admin","user"]}"
  val mapper = ObjectMapper()
  val obj = mapper.readValue(ugly, Any::class.java)
  val pretty = mapper.writerWithDefaultPrettyPrinter().writeValueAsString(obj)
  println(pretty)
}

import Foundation
let ugly = "{\"name\":\"Alice\",\"age\":30,\"roles\":[\"admin\",\"user\"]}"
if let data = ugly.data(using: .utf8),
   let obj = try? JSONSerialization.jsonObject(with: data),
   let pretty = try? JSONSerialization.data(withJSONObject: obj, options: .prettyPrinted),
   let prettyString = String(data: pretty, encoding: .utf8) {
    print(prettyString)
}

const ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}';
const pretty = JSON.stringify(JSON.parse(ugly), null, 2);
console.log(pretty);

SELECT jsonb_pretty('{"name":"Alice","age":30,"roles":["admin","user"]}'::jsonb);

SELECT JSON_PRETTY('{"name":"Alice","age":30,"roles":["admin","user"]}');

$ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}'
$obj = $ugly | ConvertFrom-Json
$pretty = $obj | ConvertTo-Json -Depth 10
Write-Output $pretty

use JSON;
my $ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}';
my $obj = decode_json($ugly);
print to_json($obj, { pretty => 1 });

import 'dart:convert';
void main() {
  const ugly = '{"name":"Alice","age":30,"roles":["admin","user"]}';
  final obj = jsonDecode(ugly);
  final pretty = JsonEncoder.withIndent('  ').convert(obj);
  print(pretty);
}

ugly = ~s({"name":"Alice","age":30,"roles":["admin","user"]})
{:ok, obj} = Jason.decode(ugly)
pretty = Jason.encode!(obj, pretty: true)
IO.puts(pretty)

import play.api.libs.json._
object Main extends App {
  val ugly = """{"name":"Alice","age":30,"roles":["admin","user"]}"""
  val jsValue = Json.parse(ugly)
  val pretty = Json.prettyPrint(jsValue)
  println(pretty)
}