Response: json() 方法
json()
是 Response
接口的一个方法,它接收一个 Response
流并将其读取到完成。它返回一个 promise,该 promise 解析为将正文文本作为 JSON
解析的结果。
请注意,尽管该方法名为 json()
,但结果不是 JSON,而是将 JSON 作为输入并将其解析以生成 JavaScript 对象的结果。
语法
js
json()
参数
无。
返回值
一个解析为 JavaScript 对象的 Promise
。此对象可以是任何可以用 JSON 表示的内容——对象、数组、字符串、数字……
异常
DOMException
AbortError
-
请求已中止。
TypeError
-
由于以下原因之一而引发
- 响应主体已损坏或锁定。
- 解码主体内容时出错(例如,因为
Content-Encoding
标头不正确)。
SyntaxError
-
响应主体无法解析为 JSON。
示例
在我们的 fetch JSON 示例(运行 fetch JSON 实时)中,我们使用 Request()
构造函数创建一个新请求,然后使用它来获取一个 .json
文件。当 fetch 成功时,我们使用 json()
读取和解析数据,然后像预期的那样从结果对象中读取值并将它们插入列表项以显示我们的产品数据。
js
const myList = document.querySelector("ul");
const myRequest = new Request("products.json");
fetch(myRequest)
.then((response) => response.json())
.then((data) => {
for (const product of data.products) {
const listItem = document.createElement("li");
listItem.appendChild(document.createElement("strong")).textContent =
product.Name;
listItem.append(` can be found in ${product.Location}. Cost: `);
listItem.appendChild(document.createElement("strong")).textContent =
`£${product.Price}`;
myList.appendChild(listItem);
}
})
.catch(console.error);
规范
规范 |
---|
Fetch 标准 # ref-for-dom-body-json① |
浏览器兼容性
BCD 表格仅在启用了 JavaScript 的浏览器中加载。