Открыть меню    

Преобразуем строку формата JSON в объект и наоборот

Преобразуем строку формата JSON в объект  и наоборот JSON (Javascript Object Notation) – текстовый формат обмена данными на основе Javascript. JSON представляет собой комбинацию форм записи литералов объектов и массивов.

От литералов объекта синтаксис JSON отличается необходимостью заключать в кавычки имена свойств.

Строка в формате JSON:

Javascript

{
    "name":"John",
    "arr":[1,2,3]
}

Преобразуем строку формата JSON в объект

Строки JSON лучше всего преобразовывать в объекты при помощи:

  1. метода JSON.parse(), который стал частью языка javascript, начиная с реализации ES5 (реализован во всех современных браузерах).

    Javascript

    
            // входная строка формата JSON
            var strJSON = '{"name":"John","arr":[1,2,3]}';
    
            var data = JSON.parse(strJSON);
    
            console.log(data.name); // John
    
            
  2. Для устаревших браузеров для доступа к объекту JSON можно использовать библиотеку https://github.com/douglascrockford/JSON-js (json2.js)
  3. Библиотека jQuery включает метод parseJSON():

    jQuery

    
    // входная строка формата JSON
    var strJSON = '{"name":"John","arr":[1,2,3]}';
    
    var data = $.parseJSON(strJSON);
    
    console.log(data.name); // John
    console.log(data.arr[0]); //1
    
    

принимаем объект или массив и преобразуем его в строку формата JSON

Существует метод JSON.stringify( ), который выполняет действие ровно противоположное методу JSON.parse(): принимает объект или массив и преобразует его в строку формата JSON.

Javascript

var obj =
{
    "name":"John",
    "arr":[1,2,3]
};

var strJSON = JSON.stringify(obj);

console.log(strJSON); // {"name":"John","arr":[1,2,3]}

console.log(typeof strJSON === 'string'); // true

В jQuery нет аналога методу JSON.stringify( ), в качестве альтернативы вы можете использовать сторонние плагины jQuery с похожей функциональностью, например, jquery-json.

Комментарии к статье

аватарка пользователя
2015-03-15
test

test

Добавить комментарий