4.1 async 和 await
async 和 await 两种语法结合可以让异步代码像同步代码一样
4.1.1 async 函数
- async 函数的返回值为 promise 对象，
- promise 对象的结果由 async 函数执行的返回值决定
- 如果返回的是一个成功的Promise，result的结果就是一个成功的Promise
- 如果返回的是一个失败的Promise，result的结果就是一个失败的Promise
- 如果函数内部抛出错误，那么结果就是一个失败的Promise
- 如果返回的是非Promise类型的数据，那么结果就是一个成功的Promise
// async 函数
async function fn() {// 返回一个字符串// return 'abc';// 返回的结果不是一个Promise 类型的对象，返回的结果就是成功的Promise对象// 抛出错误，返回的结果是一个失败的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);
})
4.1.2 await 表达式
- await 必须写在 async 函数中
- await 右侧的表达式一般为 promise 对象
- await 返回的是 promise 成功的值
- await 的 promise 失败了, 就会抛出异常, 需要通过 try…catch 捕获处理
// 创建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();
4.1.3 async与await结合案例
4.1.3.1 读取文件内容
// 1. 引入 fs 模块
const fs = require('fs');// 读取【为学】
function readWeixue() {return new Promise((resolve, reject) => {fs.readFile("./resources/weixue.txt", (err, data) => {// 如果失败if (err) reject(err);// 如果成功resolve(data);})})
}// 读取【插秧诗】
function readChayangshi() {return new Promise((resolve, reject) => {fs.readFile("./resources/chayangshi.txt", (err, data) => {// 如果失败if (err) reject(err);// 如果成功resolve(data);})})
}// 读取【观书有感】
function readGuanshu() {return new Promise((resolve, reject) => {fs.readFile("./resources/guanshu.txt", (err, data) => {// 如果失败if (err) reject(err);// 如果成功resolve(data);})})
}// 声明一个 async 函数
async function main() {// 获取为学内容let weixue = await readWeixue();// 获取插秧诗内容let chayangshi = await readChayangshi();// 获取观书有感内容let guanshu = await readGuanshu();// 输出内容console.log(weixue.toString());console.log(chayangshi.toString());console.log(guanshu.toString());
}main();
4.1.3.2 发送AJAX请求
// 发送 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);}}}})
}// asycn 与 await 测试
async function main() {let result = await sendAJAX("接口地址");console.log(result);
}main();// promise then 方法测试
sendAJAX("接口地址").then(value => {console.log(value);
}, reason => {})
4.2 Object.values 和 Object.entries
// 声明对象
const school = {name: 'abc',cities: ['北京', '上海', '广州'],xueke: ['语文', '数学', '英语']
};
- Object.keys()方法返回一个给定对象的所有可枚举键名的数组
// 获取对象所有的键
const keys = Object.keys(school);
console.log(keys);
- Object.values()方法返回一个给定对象的所有可枚举属性值的数组
// 获取对象所有的值
const values = Object.values(school);
console.log(values);
- Object.entries()方法返回一个给定对象自身可遍历属性 [key,value] 的数组
// entries
const entries = Object.entries(school);
console.log(entries);
// 因为是键值对，所以可以用Map接收
const map = new Map(entries);
console.log(map);
- Object.getOwnPropertyDescriptors，该方法返回指定对象所有自身属性的描述对象
// 对象属性的描述对象，这个方法就是获取对象属性的描述对象
const descriptor = Object.getOwnPropertyDescriptors(school);
console.log(descriptor);// 创建一个对象
const obj = Object.create(null, {name: {// 设置值value: 'abc',// 属性特性writable: true, // 可写enumerable: true, // 可枚举configurable: true // 可配置}
});
