前言:
眼前兄弟们对“ajax await”可能比较讲究,大家都需要了解一些“ajax await”的相关文章。那么小编在网摘上搜集了一些对于“ajax await””的相关资讯,希望你们能喜欢,姐妹们一起来了解一下吧!async和await
async和await两种语法结合可以让异步代码像同步代码一样。
async函数
1、async函数的返回值为 promise 对象。
2、promise 对象的结果由 async 函数执行的返回值决定。
await表达式
1、await必须写在 async 函数中。
2、await右侧的表达式一般为promise对象。
3、await返回的是promise成功的值。
4、await的promise失败了, 就会抛出异常, 需要通过 try...catch捕获处理。
代码案例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>async函数</title></head><body> <script> //async 函数 async function fn(){ // 返回一个字符串 // return '尚硅谷'; // 返回的结果不是一个 Promise 类型的对象, 返回的结果就是成功 Promise 对象 // return; //抛出错误, 返回的结果是一个失败的 Promise // throw new Error('出错啦!'); //返回的结果如果是一个 Promise 对象 return new Promise((resolve, reject)=>{ resolve('成功的数据'); // reject("失败的错误"); }); } const result = fn(); //调用 then 方法 result.then(value => { console.log(value); }, reason => { console.warn(reason); }) </script></body></html>
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>await</title></head><body> <script> //创建 promise 对象 const p = new Promise((resolve, reject) => { // resolve("用户数据"); reject("失败啦!"); }) // await 要放在 async 函数中. async function main() { try { let result = await p; // console.log(result); } catch (e) { console.log(e); } } //调用函数 main(); </script></body></html>
//1. 引入 fs 模块const fs = require("fs");//读取『为学』function readWeiXue() { return new Promise((resolve, reject) => { fs.readFile("./resources/为学.md", (err, data) => { //如果失败 if (err) reject(err); //如果成功 resolve(data); }) })}function readChaYangShi() { return new Promise((resolve, reject) => { fs.readFile("./resources/插秧诗.md", (err, data) => { //如果失败 if (err) reject(err); //如果成功 resolve(data); }) })}function readGuanShu() { return new Promise((resolve, reject) => { fs.readFile("./resources/观书有感.md", (err, data) => { //如果失败 if (err) reject(err); //如果成功 resolve(data); }) })}//声明一个 async 函数async function main(){ //获取为学内容 let weixue = await readWeiXue(); //获取插秧诗内容 let chayang = await readChaYangShi(); // 获取观书有感 let guanshu = await readGuanShu(); console.log(weixue.toString()); console.log(chayang.toString()); console.log(guanshu.toString());}main();
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>发送 AJAX 请求</title></head><body> <script> // 发送 AJAX 请求, 返回的结果是 Promise 对象 function sendAJAX(url) { return new Promise((resolve, reject) => { //1. 创建对象 const x = new XMLHttpRequest(); //2. 初始化 x.open('GET', url); //3. 发送 x.send(); //4. 事件绑定 x.onreadystatechange = function () { if (x.readyState === 4) { if (x.status >= 200 && x.status < 300) { //成功啦 resolve(x.response); }else{ //如果失败 reject(x.status); } } } }) } //promise then 方法测试 // sendAJAX(";).then(value=>{ // console.log(value); // }, reason=>{}) // async 与 await 测试 axios async function main(){ //发送 AJAX 请求 let result = await sendAJAX(";); //再次测试 let tianqi = await sendAJAX(';) console.log(tianqi); } main(); </script></body></html>
标签: #ajax await