vue3.0学习-day2

1、async/await

async/await是ES8引入的新语法，用来简化Promise异步操作。在async/await出现之前，开发者只能通过链式.then()的方式处理Promise异步操作。

import thenFs from "then-fs";

 async function getAllFile(){
    const r1 = await thenFs.readFile('./file/1.txt','utf8')
    //这里输出的是文件里的具体内容，如果不加await则输出的是一个Promise实例
    console.log(r1);
    const r2 = await thenFs.readFile('./file/2.txt','utf8')
    console.log(r2);
    const r3 = await thenFs.readFile('./file/3.txt','utf8')
    console.log(r3);
}

getAllFile()

注意事项

• 如果在function中使用了await，则function必须被async修饰
• 在async方法中，第一个await之前的代码会同步执行，await之后的代码会异步执行

import thenFs from "then-fs";

console.log('A');
 async function getAllFile(){
    console.log('B');
    const r1 = await thenFs.readFile('./file/1.txt','utf8')
    const r2 = await thenFs.readFile('./file/2.txt','utf8')
    const r3 = await thenFs.readFile('./file/3.txt','utf8')
    console.log(r1, r2, r3);
    console.log('D');
}

getAllFile()
console.log('C');

2、同步任务和异步任务

为了防止某个耗时任务导致程序假死，JS把待执行的任务分成了同步任务和异步任务：

• 同步任务：又叫做非耗时任务，指的是在主线程上排队执行的任务，只有前一个任务执行完毕，才能执行下一个任务
• 异步任务：又叫做耗时任务，异步任务是由JS委托给宿主环境进行执行（例如node、浏览器），当异步任务执行完成后，会通知JS主线程执行异步任务的回调函数

3、宏任务和微任务

JS把异步任务分为宏任务和微任务：

• 宏任务：：异步Ajax请求、setTimeout、setInterval、文件操作和其他
• 微任务：Promise.then .catch .finall、process.nextTick和其他

同步先执行，异步后执行，微任务先执行，宏任务后执行，注意每一个宏任务执行完之后，都会检查是否存在待执行的微任务，如果有，则执行所有微任务之后，再继续执行下一个宏任务。