JavaScript - JSON и методы работы с ним. Введение в JSON Что за файл json txt

Объявление

Формат файлов JSON Website

Файлы JSON используются для хранения структур простых массивов данных с помощью формата, основанного на тексте, который может прочесть человек. Изначально файлы JSON были тесно связаны с языком программирования JavaScript, однако вследствие того, что в данный момент этот формат поддерживает большое кол-во программных API, его можно рассматривать в качестве формата, который не привязан ни к одному из языков программирования. Данная альтернатива формату XML наиболее часто используется веб-приложениями Ajax.

Технические сведения о файлах JSON

Файлы JSON используются в качестве файлов для обмена данными. Такой обмен часто происходит между компьютерами, подключенными через Интернет. Таким образом, очень редко файлы с расширением JSON сохраняются на жестком диске компьютера. Некоторые приложения, однако, все еще используют этот формат. К примеру, данные профиля Google+ сохраняются и загружаются в формате JSON, а веб-браузер Mozilla Firefox использует файлы этого формата для хранения резервных копий закладок.

Дополнительная информация о формате JSON

Урок, в котором рассматривается, что такое JSON и какие он имеет преимущества по сравнению с другими форматами данных.

Понятие JSON

JSON (JavaScript Object Notation) - это текстовый формат представления данных в нотации объекта JavaScript.

Это означает то, что данные в JSON организованы, так же как и в объекте JavaScript. Но в отличие от последнего формат записи JSON имеет некоторые особенности, которые будут рассмотрены немного позже.

Применяется JSON обычно в связки с AJAX для того, чтобы сервер мог передать данные в удобной форме сценарию JavaScript, который затем уже отобразит их на странице.

Структура формата JSON

Кто знаком с процессом создания объектов в JavaScript, не увидит ни чего нового в структуре формата JSON. Это связано с тем, что структура JSON соответствует структуре объекта JavaScript с некоторыми ограничениями.

Более просто представить себе JSON можно как контейнер, состоящий из элементов. Каждый элемент в таком контейнере - это некоторая структурная единица, состоящая из ключа и значения.

При этом значение напрямую связано с ключом и образуют так называемую пару ключ-значение. Для того чтобы получить значение в таком объекте, необходимо знать его ключ. Синтаксически такие данные в JSON записываются следующим образом:

В вышеприведенной записи видно, что ключ отделяется от значения с помощью знака двоеточия (:). При этом ключ в объекте JSON обязательно должен быть заключен в двойные кавычки. Это первая особенность JSON, которая его отличает от объекта JavaScript . Т.к. в объекте JavaScript ключ (свойство объекта) не обязательно должен быть заключён в двойные кавычки.

Например, структура объекта, которая является валидной с точки зрения JavaScript и не валидной с точки зрения JSON:

Var person = { name: "Иван"; } // объект JavaScript

Предупреждение: имя ключу старайтесь задавать так чтобы не усложнить доступ к данным, т.е. при составлении имени предпочтительно придерживаться верблюжьей нотации или использовать для соединения слов знак нижнего подчёркивания ("_").

Значение ключа в JSON может быть записано в одном из следующих форматов: string (строкой), number (числом), object (объектом), array (массивом), boolean (логическим значением true или false), null (специальным значением JavaScript).

Это второе ограничение в JSON, т.к. объект JavaScript может содержать любой тип данных, включая функцию .

Var person = { "name" : "Иван"; "setName": function() { console.log(this.name); } } // объект JavaScript

Для отделения одного элемента (пары ключ-значение) от другого используется знак запятая (,).

Например, рассмотрим JSON, состоящий из различных типов данных.

Внимание: формат представления данных JSON не допускает использование внутри своей структуры комментариев.

Работа с JSON в JavaScript

В отличие от объекта JavaScript JSON представляет собой строку.

Например:

// например переменная personData, содержит строку, которая представляет из себя JSON var personData = "{"name":"Иван","age":37,"mother":{"name":"Ольга","age":58},"children":["Маша","Игорь","Таня"],"married": true,"dog": null}";

Работа с JSON обычно ведётся в двух направлениях:

1. Парсинг - это перевод строки, содержащей JSON, в объект JavaScript.
2. Конвертирование объекта JavaScript в строку JSON. Другими словами, это действие выполняет преобразование обратное парсингу.

Парсинг JSON

Парсинг JSON, т.е. перевод строки JSON в объект JavaScript, осуществляется с помощью метода eval() или parse() .

Использование метода eval():

// переменная person - это объект JavaScript, который получен путём выполнения кода (строки) JSON var person= eval("("+personData+")");

Использование метода JSON.parse():

// переменная person - это объект JavaScript, который получен путём парсинга строки JSON var person = JSON.parse(personData);

Конвертирование объекта JavaScript в строку JSON

Перевод объекта JavaScript в строку JSON осуществляется с помощью метода JSON.stringify() . Данный метод осуществляет действие обратное методу JSON.parse() .

Var personString = JSON.strigify(person);

Преимущества формата JSON

Формат представления данных JSON имеет следующие преимущества:

• удобные и быстрые в работе методы, предназначенные для конвертации (парсинга) строки JSON в объект JavaScript и обратно;
• понятная и простая структура данных;
• очень маленький размер по сравнению с другими форматами данных (например XML). Это связано с тем, что формат JSON содержит минимальное возможное форматирование, т.е. при его написании используется всего несколько специальных знаков. Это очень важное преимущество, т.к. данные представленные в формате JSON будут быстрее загружаться, чем, если бы они были бы представлены в других форматах.

Из-за того что данный формат имеет очень много преимуществ он стал применяться не только в JavaScript, но и во многих других языках, таких как C, Ruby, Perl, Python, PHP и т.д.

Сравнение форматов JSON и XML

Формат JSON имеет следующие преимущества перед форматом XML:

1. При передаче некоторых данных размер JSON будет значительно меньше, чем размер XML.
2. JSON имеет более удобные методы конвертации в структуры данных JavaScript, чем XML.
3. JSON более просто создавать, чем XML.

Работа с данными JSON после парсинга осуществляется как с объектом JavaScript.

//JSON var personData = "{"name":"Иван","age":37,"mother":{"name":"Ольга","age":58},"children":["Маша","Игорь","Таня"],"married": true,"dog": null}"; //Объект JavaScript person var person = JSON.parse(personData);

Рассмотрим основные моменты:

//получить значения ключа (свойства) name person.name; person["name"]; //получить значения ключа (свойства) name, находящегося в объекте mother person.mother.name; //удалить элемент age delete(person.age) //добавить (или обновить) ключ (свойство) person.eye = "карие"; //при работе с массивами необходимо использовать методы, предназначенные для работы именно с массивами //удалить 1 элементиз массива (метод splice) person.children.splice(1,1) //добавить элемент в массив (метод push) person.children.push("Катя");

Для перебора элементов в объекте можно использовать цикл for..in:

For (key in person) { if (person.hasOwnProperty(key)) { //ключ = key //значение = person console.log("Ключ = " + key); console.log("Значение = " + person); } // если объект person имеет key (если у person есть свойство key) } // перерабрать все ключи (свойства) в объекте

Для перебора элементов массива можно использовать следующий цикл:

For (var i=0; i

JSON - это текстовый формат записи данных. Он позволяет в текстовом виде представить как отдельное число или строку, так и сложные структуры, например, массивы с данными. Использование этого формата записи удобно тем, что он читабелен и интуитивно понятен, в то же время позволяет сохранять очень сложные структуры данных. Кроме того, он более компактный, чем xml, поэтому на мой взгляд более предпочтителен для обмена данными между веб-браузером и сервером.

Синтаксис JSON на примерах

Формат json обычно записывается в 2-х вариантах:

1. Последовательность значений. Например, последовательность 10, 15 и "test" в формате JSON будут выглядеть так:

2. Запись в виде пар ключ: значение . Например:

{"ФИО":"Иванов Сергей", "Дата рождения":"09.03.1975"}

Немного более сложный пример:

{ "ФИО" : "Иванов Сергей", "Адрес" : { "Город" : "Москва", "Улица" : "Пятницкая", "Дом" : "35" } }

PHP функции для работы с JSON-форматом

В языке php начиная с версии 5.2. есть всего 4 функции:

• json_decode - Декодирует строку JSON (из строки json-формата получает данные)
• json_encode - Возвращает JSON-представление данных (преобразует данные в json-строку)
• json_last_error_msg - Возвращает строку с сообщением об ошибке последнего вызова json_encode() или json_decode()
• json_last_error - Возвращает последнюю ошибку

В основном по-большей части, используются всего две функции: json_encode и json_decode . Не буду вдаваться в подробности их синтаксиса, подробнее можете посмотреть на php.net . Пример использования:

$arr1 = array(0,1,2); $json_str = json_encode($arr1); echo $json_str; // выведет json-строку: $arr2 = json_decode($json_str); echo $arr2; // выведет: 1

Обратите внимание : при кодировании в JSON-формат данных на русском языке , функция json_encode преобразует русские символы в юникод , т.е. заменяет их на \uXXXX и таким образом, json-строка становится не читабельной для человека (но понятной для браузера). Если нужно, чтобы преобразования в юникод не происходило (например, при отладке кода), можно просто использовать опцию JSON_UNESCAPED_UNICODE.

Так же, чтобы при кодировании не добавлялись слэши для экранирования и чтобы строки с числами кодировались как числа, можно использовать JSON_UNESCAPED_SLASHES и JSON_NUMERIC_CHECK. В итоге, чтобы json-строка была читабельной для человека, сделаем, например, так:

$arr = array("fio" => "Иванов Сергей", "age" => "32", "vk_url" => "https://vk.com/id11111"); echo json_encode($arr, JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES | JSON_NUMERIC_CHECK);

Без использования этих опций строка была бы такой:

{ "fio" : "\u0418\u0432\u0430\u043d\u043e\u0432 \u0421\u0435\u0440\u0433\u0435\u0439", "age" : "32", "vk_url":"https:\/\/vk.com\/id11111" }

а с использованием опций, получим читабельную строку:

{ "fio" : "Иванов Сергей", "age" : 32, "vk_url" : "https://vk.com/id11111" }

Еще один момент: если нужно чтобы при декодировании json-строки функция json_decode возвращала именно массив , просто добавьте второй параметр в функцию равный true.

$json_str = "{ "a":1, "b":2, "c":3 }"; $obj = json_decode($json_str); // получим объект echo $obj->a; // выведет 1 $arr = json_decode($json_str, true); // получим ассоциативный массив echo $arr["a"]; // выведет 1

На этом рассмотрение php-функций завершу.

JavaScript функции для работы с JSON-форматом

Начнем с того, что JSON-формат, изначально был придуман для языка JavaScript и потом стал просто отдельным текстовым форматом, используемым в разных языках. Видимо, поэтому синтаксис JSON очень похож на синтаксис записи обычных объектов и массивов.

// Пример массива в JavaScript arr = ; alert(arr); // выведет 1 // Пример объекта в JavaScript obj = { "name": "Вася", "age": 35, "isAdmin": false } alert(obj.name); // выведет "Вася"

Функции JavaScript, используемые для преобразования в JSON-формат и обратно:

• JSON.parse - декодирование JSON-строки (преобразование строки в объекты и/или массивы)
• JSON.stringify - возвращает JSON-представление данных (преобразование объектов и/или массивов в json-строку)

Простой пример декодирования json-строки в массив с цифрами:

Str = ""; arr = JSON.parse(str); alert(arr); // выведет 1

Пример преобразования (сериализации) объекта в JSON-строку:

Obj = { "name": "Вася", "age": 35, "isAdmin": false } alert(JSON.stringify(obj)); // выведет {"name":"Вася","age":35,"isAdmin":false}

При сериализации (преобразовании) объекта в JSON-строку, вызывается метод toJSON этого объекта, если он существует. Если метода нет, тогда перечисляются все свойства объекта. Пример преобразования объекта с методом toJSON:

Obj = { "name": "Вася", "age": 35, "isAdmin": false, toJSON: function() { return this.age; } } alert(JSON.stringify(obj)); // выведет 35

Примеры практического применения JSON-формата

Собственно, лично я, применяю формат JSON в 2-х основных ситуациях:

1. Передача данных между браузером и сервером с использованием Ajax-запросов.

Например, у нас есть какая-то страница, на которой нужно обновить данные без перезагрузки страницы. Допустим, нужно чтобы с сервера "подгрузилась" информация со списком сотрудников и их данными.

В JavaScript с помощью jQuery делаем простой и выводим данные в виде таблицы в браузер:

$.getJSON("get-info.php").success(function(data) { // ajax-запрос, данные с сервера запишутся в переменную data htmlstr = "

Расширение файла	.json
Категория файлов
Файл-пример	(0,57 KiB)
Связанные программы	Microsoft Notepad Microsoft WordPad Notepad ++ Mozilla Firefox

"; for (var i=0; i"; // первая колонка - ФИО htmlstr += ""; // вторая колонка - Дата рождения htmlstr += ""; } htmlstr = "

" + data[i].birthday + "

"; $("div.info").html(htmlstr); // в div с классом info выводим получившуюся таблицу с данными });

На сервере скрипт get-info.php к которому делается ajax-запрос, может быть, например, таким:

$user_info = array(); // создаем массив с данными $user_info = array ("fio" => "Иванов Сергей", "birthday" => "09.03.1975"); $user_info = array ("fio" => "Петров Алексей", "birthday" => "18.09.1983"); echo json_encode($user_info); exit;

В этом примере JSON-строка, которая была передана с сервера в браузер была такой:

[{"fio":"Иванов Сергей","birthday":"09.03.1975"},{"fio":"Петров Алексей","birthday":"18.09.1983"}]

Я специально не стал показывать строку в виде "дерева", т.к. она передается именно в таком виде. И как вы можете оценить, запись данных в формате JSON получилась очень компактной , а это значит, что передача этих данных от сервера к браузеру будет практически мгновенной.

2. Запись сложных структур данных в базу данных.

Иногда бывают ситуации, когда заводить еще одну таблицу в базе данных не целесообразно, чтобы сохранить различные данные. Допустим, предположим, у зарегистрированного на сайте пользователя есть возможность сделать настройку цвета фона и цвета текста.

Вместо того, чтобы заводить еще одну таблицу ради 2-х настроек, можно просто в таблице со списком пользователей сделать текстовый столбец, в который помещать данные настроек пользователя. Тогда запрос обновления настроек, может например, быть таким:

UPDATE users SET settings = "{"background-color":"#FFFFFF", "text-color":"#000000"}" WHERE user_id = 10

В будущем, получив из таблицы users информацию, скрипт php может легко превратить их обратно в массив с настройками. Например, если переменная $user_info содержит данные, полученные по пользователю из таблицы users, получить массив с настройками очень просто:

$settings = json_decode($user_info["settings"], true); echo "Цвет фона = ".$settings["background-color"]; echo "Цвет текста = ".$settings["text-color"];

В формате JSON, можно так же, например, записать в базу данных какие опции товаров выбрал покупатель.

{"15":["45","47"], "18":"52"} // у опции 15 выбраны значения 45 и 47, а у опции 18 выбрано значение 52

Впринципе, можно даже и всё содержимое корзины записать в формате JSON, например, так:

{ "user_id" : 10, "session_id" : "2c2l3h4ii271aojentejtdcmh3", "products": [ { "product_id" : 15, "options" : { "15" : , "18" : 52 }, "quantity" : 1, "price" : 1500 }, { "product_id" : 16, "options" : { "15" : , "18" : 51 }, "quantity" : 2, "price" : 1000 } ] }

В обычном не древовидном виде эта JSON-строка будет такой:

{"user_id":10,"session_id":"2c2l3h4ii271aojentejtdcmh3","products":[{"product_id":15,"options":{"15":,"18":52},"quantity":1,"price":1500},{"product_id":16,"options":{"15":,"18":51},"quantity":2,"price":1000}]}

Таким образом, как видно из примеров, в формате JSON можно хранить и передавать практически любую информацию.

JSON (JavaScript Object Notation) - простой формат обмена данными, удобный для чтения и написания как человеком, так и компьютером. Он основан на подмножестве языка программирования JavaScript , определенного в стандарте ECMA-262 3rd Edition - December 1999 . JSON - текстовый формат, полностью независимый от языка реализации, но он использует соглашения, знакомые программистам C-подобных языков, таких как C, C++, C#, Java, JavaScript, Perl, Python и многих других. Эти свойства делают JSON идеальным языком обмена данными.

JSON основан на двух структурах данных:

• Коллекция пар ключ/значение. В разных языках, эта концепция реализована как объект , запись, структура, словарь, хэш, именованный список или ассоциативный массив.
• Упорядоченный список значений. В большинстве языков это реализовано как массив , вектор, список или последовательность.

Это универсальные структуры данных. Почти все современные языки программирования поддерживают их в какой-либо форме. Логично предположить, что формат данных, независимый от языка программирования, должен быть основан на этих структурах.

В нотации JSON это выглядит так:

Объект - неупорядоченный набор пар ключ/значение. Объект начинается с { открывающей фигурной скобки и заканчивается } закрывающей фигурной скобкой. Каждое имя сопровождается: двоеточием, пары ключ/значение разделяются, запятой.

Массив - упорядоченная коллекция значений. Массив начинается с [ открывающей квадратной скобки и заканчивается ] закрывающей квадратной скобкой. Значения разделены, запятой.

Значение может быть строкой в двойных кавычках, числом , true , false , null , объектом или массивом . Эти структуры могут быть вложенными.

Строка - коллекция нуля или больше символов Unicode, заключенная в двойные кавычки, используя \ обратную косую черту в качестве символа экранирования. Символ представляется как односимвольная строка. Похожий синтаксис используется в C и Java.

Число представляется так же, как в C или Java, кроме того, что используется толко десятичная система счисления.

Пробелы могут использоваться между любыми лексемами.

Исключая некоторые детали кодирования, вышеизложенное полностью описывает язык.

Знакомые с программированием люди сразу узнают файлы с расширением JSON. Этот формат – аббревиатура терминов JavaScript Object Notation, и является он по сути текстовым вариантом обмена данными, использующемся в языке программирования JavaScript. Соответственно, справиться с открытием таких файлов поможет либо специализированное ПО, либо текстовые редакторы.

Основной особенностью скриптов в формате JSON является взаимозаменяемость его на формат XML. Оба типа представляют собой текстовые документы, которые можно открывать текстовыми процессорами. Однако начнем мы со специализированного ПО.

Способ 1: Altova XMLSpy

Достаточно известная среда разработки, которую используют в том числе и веб-программисты. Эта среда также генерирует файлы JSON, следовательно способна и открывать сторонние документы с таким расширением.

Недостатков у данного ПО два. Первый – платная основа распространения. Пробная версия активна 30 дней, однако для её получения необходимо указать имя и почтовый ящик. Второй – общая громоздкость: человеку, которому просто нужно открыть файл, она может показаться чересчур навороченной.

Способ 2: Notepad++

Многофункциональный текстовый редактор Notepad++ — первый из списка подходящих для открытия скриптов в формате JSON.

Плюсов у Notepad++ изрядно – тут и отображение синтаксиса многих языков программирования, и поддержка плагинов, и малый размер… Однако в силу некоторых особенностей работает программа неторопливо, особенно если открыть в ней объемный документ.

Способ 3: AkelPad

Невероятно простой и в то же время богатый на возможности текстовый редактор от российского разработчика. В число поддерживаемых им форматов входит и JSON.

Как и Notepad++, этот вариант блокнота также бесплатен и поддерживает плагины. Он работает шустрее, однако большие и сложные файлы может не открыть с первого раза, так что имейте в виду такую особенность.

Способ 4: Komodo Edit

Бесплатное ПО для написания программного кода от компании Komodo. Отличается современным интерфейсом и широкой поддержкой функций для программистов.

В программе, к сожалению, отсутствует русский язык. Однако рядового пользователя скорее отпугнет избыточный функционал и непонятные элементы интерфейса – все-таки этот редактор ориентирован в первую очередь на программистов.

Способ 5: Sublime Text

Еще один представитель code-oriented текстовых редакторов. Интерфейс проще, чем у коллег, однако возможности те же. Доступна и портативная версия приложения.

К сожалению, Sublime Text недоступен на русском языке. Недостатком можно назвать и условно-бесплатную модель распространения: свободная версия ничем не ограничена, но время от времени появляется напоминание о необходимости покупки лицензии.

Способ 6: NFOPad

Простой блокнот, однако для просмотра документов с расширением JSON тоже подойдет.