Correcting teacher:PHPz
Correction status:qualified
Teacher's comments:
实例演示 fetch / async / await 的使用场景
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>fetch/async/await</title>
</head>
<body>
<script>
fetch("https://jsonplaceholder.typicode.com/todos/5")
.then(function (response) {
return response.json();
})
.then(function (json) {
console.log(json);
});
/**
* 1. fetch(url): promise
* 2. then: 调用响应对象的方法生成JSON数据(response.json())
* 3. then: 拿到第二步的响应数据JSON,执行相关操作,例如 DOM
*/
/**
* 1. fetch(url): promise
* 2. then: (response)=>response.json()
* 3. then: (json)=>console.log(json)
*/
// function 前添加 async , 转为异步函数
async function getUser() {
let url = "http://site.io/data.php?id=1";
// 1. 等待结果再进行下一步操作,返回响应对象
const response = await fetch(url);
// 2. 将响应结果,转为json, json()
const result = await response.json();
console.log(result);
}
</script>
</body>
</html>