ES8内容总结

ES8内容总结

1. async和await
2. async
3. await
4. Object方法获取对象

1.

async和await

• async和await两种语法结合可以让异步代码像同步代码一样

2.

async

1. async 函数的返回值是promise 对象

2. promise 对象的结果由async函数执行的返回值决定

   async function fn() {
     return 'dd'//这个大括号里面的返回状态成功与否和promise的then方法一直
   }
   console.log(fn());
   fn().then((res) => {
     console.log(res);//dd
   })
   

​

3.

await

1. await 必须写在async 函数中

2. await 右侧的表达式一般为promise对象

3. await返回的是promise成功的值

4. await的promise失败了，就会抛出异常，需要通过try…catch捕获处理

   const p = new Promise((resolve, reject) => {
     //调用成功
     // resolve('用户数据')
     //调用失败
     reject('aaaa')
   });
   //await要放在async函数中
   async function main() {
     //await 只返回成功的promise值
     // let result = await p
     // console.log(result);
     //如果调用失败,则报错，就必须抛出异常
     try {
       await p;
     } catch (error) {
       console.log('我被抛出');//我被抛出
     }
   }
   main()
   

async和await结合的案例

1. 读取文件

   const fs = require('fs');
   
   function file1() {
     return new Promise((resolve, reject) => {
       fs.readFile('./文件1', (err, data) => {
         if (err) reject(err)
         resolve(data)
       })
     });
   }
   function file2() {
     return new Promise((resolve, reject) => {
       fs.readFile('./文件2', (err, data) => {
         if (err) reject(err)
         resolve(data)
       })
     });
   }
   
   async function read() {
     let result = await file1()
     let result2 = await file2()
     console.log(result + '\n' + result2);
   }
   read()
   

   

2. 发送AJAx请求

   function sendxml(url) {
     return new Promise((resolve, reject) => {
       const p = new XMLHttpRequest();
       p.open('GET', url);
       p.send();
       p.onreadystatechange = function () {
         if (p.readyState === 4) {
           if (p.status >= 200 && p.status < 300) {
             resolve(p.response);
           }
           else {
             reject(p.status)
           }
         }
       }
     });
   }
   //promise.then方法测试
   //sendxml("https://api.apiopen.top/getJoke").then(res => { console.log(res); })
   
   
   //async await测试
   async function xml() {
     let result = await sendxml("https://api.apiopen.top/getJoke");
     console.log(result);
   }
   xml()
   

4.

Object方法获取对象

const school = {
  name: 'xinyue',
  cities: ['北京', '上海', '深圳'],
  xueke: ['前端', 'Java', '大数据', '运维']
}
//获取对象所有的键
let result = Object.keys(school)
console.log(result);
//1.通过键名遍历对象
for (var i of result) {
  let item = school[i]
  console.log(item);
}

console.log('----------------------------------------');

console.log(Object.values(school));//返回值放进新数组中

console.log("----------------------------------------");

console.log(Object.entries(school));//返回的是新数组，里面包含成员数组

console.log("----------------------------------------");

//创建Map
const m = new Map(Object.entries(school));
console.log(m);
console.log(m.get('cities'));

console.log("----------------------------------------");

//输出对象的描述对象，就是他根据键名把里面的内容描述了一下,数据劫持就是根据它
console.log(Object.getOwnPropertyDescriptors(school));

const obj = Object.create(null, {
  name: {
    value: 'xinyue',
    writable: true,//这三个属性决定是否可以深拷贝，是否可以重新赋值
    configurable: true,
    enumerable: true
  }
})
console.log(obj);//null:得到一个非常纯净的map对象,没有原型继承,如果想自定义一些属性可以用它
//把null 改成 {}:得到的对象有原型链