diff options
Diffstat (limited to 'files/ru/web/api/body/json/index.html')
| -rw-r--r-- | files/ru/web/api/body/json/index.html | 77 |
1 files changed, 77 insertions, 0 deletions
diff --git a/files/ru/web/api/body/json/index.html b/files/ru/web/api/body/json/index.html new file mode 100644 index 0000000000..649c5b60e6 --- /dev/null +++ b/files/ru/web/api/body/json/index.html @@ -0,0 +1,77 @@ +--- +title: Body.json() +slug: Web/API/Body/json +tags: + - Fetch-запрос + - Справка + - метод +translation_of: Web/API/Body/json +--- +<div>{{APIRef("Fetch")}}</div> + +<p>Метод <strong><code>json()</code></strong> , определен на миксине {{domxref("Body")}}, который включён в объектах <a href="https://developer.mozilla.org/ru/docs/Web/API/Request" rel="nofollow" title="Документация об этом ещё не написана; пожалуйста, поспособствуйте её написанию!"><code>Request</code></a> и <a href="https://developer.mozilla.org/ru/docs/Web/API/Response" rel="nofollow" title="Документация об этом ещё не написана; пожалуйста, поспособствуйте её написанию!"><code>Response</code></a>, принимает и читает тело {{domxref("Response")}} stream. Возвращает promise (обещание), который, когда ответ будет получен, вызовет коллбэк с результатом парсинга тела ответа в {{jsxref("JSON")}} объект.</p> + +<h2 id="Синтаксис">Синтаксис</h2> + +<pre class="brush: js">response.json().then(function(data) { + // do something with your data +});</pre> + +<h3 id="Аргументы">Аргументы</h3> + +<p>Нет.</p> + +<h3 id="Возвращает">Возвращает</h3> + +<p>Promise (обещание), который, когда ответ будет получен, вызовет коллбэк с результатом парсинга тела ответа в JSON объект. Этим может быть что угодно, что может быть представлено как JSON объект — объект, массив, строка, число...</p> + +<h2 id="Пример">Пример</h2> + +<p>В нашем <a href="https://github.com/mdn/fetch-examples/tree/master/fetch-json">fetch json примере</a> (запустите <a href="http://mdn.github.io/fetch-examples/fetch-json/">fetch json live</a>), мы создаем новый запрос, используя {{domxref("Request.Request")}} конструктор, в последствии мы используем его (запрос) для получения <code>.json</code> файла. Когда fetch запрос будет выполнен, мы прочтем и спарсим данные, используя <code>json()</code>, а далее вставим значения из полученного объекта в list элементы списка для отображения данных по нашему продукту.</p> + +<pre class="brush: js">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); + } + });</pre> + +<h2 id="Спецификации">Спецификации</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('Fetch','#dom-body-json','json()')}}</td> + <td>{{Spec2('Fetch')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> + +<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад, пожалуйста пожалуйста проверьте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам pull request.</div> + +<p>{{Compat("api.Body.json")}}</p> + +<h2 id="Смотрите_также">Смотрите также</h2> + +<ul> + <li><a href="/en-US/docs/Web/API/ServiceWorker_API">ServiceWorker API</a></li> + <li><a href="/en-US/docs/Web/HTTP/Access_control_CORS">HTTP access control (CORS)</a></li> + <li><a href="/en-US/docs/Web/HTTP">HTTP</a></li> +</ul> |