--- title: Body.json() slug: Web/API/Body/json tags: - Fetch-запрос - Справка - метод translation_of: Web/API/Body/json ---
{{APIRef("Fetch")}}

Метод json() , определен на миксине {{domxref("Body")}}, который включён в объектах Request и Response, принимает и читает тело {{domxref("Response")}} stream. Возвращает promise (обещание), который, когда ответ будет получен, вызовет коллбэк с результатом парсинга тела ответа в {{jsxref("JSON")}} объект.

Синтаксис

response.json().then(function(data) {
  // do something with your data
});

Аргументы

Нет.

Возвращает

Promise (обещание), который, когда ответ будет получен, вызовет коллбэк с результатом парсинга тела ответа в JSON объект. Этим может быть что угодно, что может быть представлено как JSON объект — объект, массив, строка, число...

Пример

В нашем fetch json примере (запустите fetch json live), мы создаем новый запрос, используя {{domxref("Request.Request")}} конструктор, в последствии мы используем его (запрос) для получения .json файла. Когда fetch запрос будет выполнен, мы прочтем и спарсим данные, используя json(), а далее вставим значения из полученного объекта в list элементы списка для отображения данных по нашему продукту.

var myList = document.querySelector('ul');

var myRequest = new Request('products.json');

fetch(myRequest)
  .then(function(response) { return response.json(); })
  .then(function(data) {
    for (var i = 0; i < data.products.length; i++) {
      var listItem = document.createElement('li');
      listItem.innerHTML = '<strong>' + data.products[i].Name + '</strong> can be found in ' +
                           data.products[i].Location +
                           '. Cost: <strong>£' + data.products[i].Price + '</strong>';
      myList.appendChild(listItem);
    }
  });

Спецификации

Specification Status Comment
{{SpecName('Fetch','#dom-body-json','json()')}} {{Spec2('Fetch')}}  

Совместимость с браузерами

{{Compat("api.Body.json")}}

Смотрите также