JSON.parse()

Zamienia napis w formacie JSON na wartość JavaScript, np. obiekt lub tablicę.

Zwraca: Wartość JavaScript odpowiadającą tekstowi JSON.

Na tej stronie

Przykład
Definicja i zastosowanie
Składnia
Parametry
Więcej przykładów
Obsługa przeglądarek
Dobre praktyki
Powiązane hasła

Przykład

JavaScript

const json = '{"name":"Kuba","level":3,"skills":["HTML","CSS"],"premium":true}'
const user = JSON.parse(json)

console.log(user.name)
console.log(user.skills[1])
console.log(user)

Konsola

Kuba

CSS

{ name: 'Kuba', level: 3, skills: ['HTML', 'CSS'], premium: true }

Definicja i zastosowanie

Metoda JSON.parse() odczytuje tekst w formacie JSON i tworzy z niego odpowiadającą mu wartość: obiekt, tablicę, napis, liczbę, true, false lub null. Używa się jej do danych z serwera, z localStorage czy z plików konfiguracyjnych.

Format JSON jest bardziej rygorystyczny niż zapis obiektów w JavaScripcie. Klucze i napisy muszą być w podwójnych cudzysłowach, po ostatnim elemencie nie może stać przecinek, a komentarze są zabronione. Niepoprawny tekst powoduje błąd SyntaxError, dlatego dane z niepewnego źródła parsuj w bloku try...catch.

Opcjonalny drugi argument (reviver) to funkcja wywoływana dla każdej pary klucz i wartość. Pozwala przekształcić wynik w trakcie odczytu, na przykład zamienić napisy z datami z powrotem na obiekty Date.

Składnia

JSON.parse(text)
JSON.parse(text, reviver)

Parametry

text
napis
Tekst w formacie JSON.
reviver
opcjonalna function (key, value)
Funkcja przekształcająca każdą odczytaną wartość. To, co zwróci, trafi do wyniku.

Parametr	Typ	Opis
text	napis	Tekst w formacie JSON.
reviver	opcjonalna function (key, value)	Funkcja przekształcająca każdą odczytaną wartość. To, co zwróci, trafi do wyniku.

Więcej przykładów

Bezpieczne parsowanie niepewnych danych

JavaScript

function safeParse(text, fallback) {
  try {
    return JSON.parse(text)
  } catch {
    return fallback
  }
}

console.log(safeParse('{"theme":"dark"}', {}))
console.log(safeParse("{theme: 'dark'}", {}))

Konsola

{ theme: 'dark' }

{}

Przywracanie dat przez reviver

JavaScript

const json = '{"title":"Egzamin","date":"2026-09-28T10:30:00.000Z"}'

const exam = JSON.parse(json, (key, value) => (key === 'date' ? new Date(value) : value))

console.log(exam.date instanceof Date)
console.log(exam.date.getUTCHours())

Konsola

true

Najczęstsze błędy składni

JavaScript

const attempts = ["{'level': 1}", '{"level": 1,}', '{"level": 1}']

for (const text of attempts) {
  try {
    console.log(JSON.parse(text))
  } catch (error) {
    console.log(error.name)
  }
}

Konsola

SyntaxError

{ level: 1 }

Pierwszy napis używa pojedynczych cudzysłowów, a drugi ma przecinek po ostatnim elemencie. Oba zapisy są poprawne w JavaScripcie, ale nie w JSON.

Obsługa przeglądarek

Szeroko dostępne

Działa we wszystkich nowoczesnych przeglądarkach, także na telefonach. Możesz używać bez obaw.

Chrome
Edge
Firefox
Safari

Dobre praktyki

Dane z sieci, od użytkownika i z localStorage zawsze parsuj w try...catch. Jeden zły znak rzuci SyntaxError.
JSON.parse() nie odtworzy dat, Map ani instancji klas. Daty przywrócisz funkcją reviver.
Przy fetch() zamiast JSON.parse(await response.text()) użyj po prostu await response.json().

Powiązane hasła

Widzisz błąd albo brakuje przykładu? Napisz do nas.

Darmowy kursPrzećwicz JavaScript w kursie JavaScript i ReactZadania z podpowiedziami, edytor kodu i postępy zapisywane na bieżąco.Zobacz kurs