课程名称: Node.js工程师养成计划
课程章节: JavaScript面试提升
课程讲师: 北瑶
课程内容:
JS异步执行逻辑拆解
案例1
console.log(1)
console.log(2)
console.log(3)
console.log(4)
执行环境栈, 首先先需要把我们写的这些代码以文本字符串的方式先读进执行环境栈中, 先把这些代码加载到我们的内存当中, 然后进行解析, 从上往下开始读, 在执行环境栈当中在开辟一块内存, 文本字符串加入到内存中执行, 我们叫入栈, 当这行代码执行结束之后, 在控制台中打印之后呢, 就意味着执行完毕, 然后这行代码会在执行上下文中出去, 我们叫出栈
案例2
setTimeout(()=> {
console.log('1')
}, 30)
console.log(2)
setTimeout(()=>{
console.log(3)
},20)
cconsole.log(4)
setTimeout 定时器当然是第一时间执行的, 但是会告诉的 JavaScript 引擎我要在过一段时间在执行这个函数, 所以我们会在开辟一块空间, 这个空间就专门来存放异步逻辑的地方, 当前同步调用栈没有清空, 异步任务是不会执行的 Event loop 事件轮询机制
Promise异步处理机制
在ES6中，新增了Promise这个类 用来处理异步代码
// Promise用法：
因Promise是一个类，所以需要new Promise来使用
// 在new时 Promise需要传入一个参数 参数为回调函数 这个回调函数在创建时就会被立即调用
// 该回调函数有俩个参数 分别也是回调函数 resolve 和 reject(为形参名可随意起名)
// 当第一个回调参数被调用时，会调用new出来的这个对象下的then方法，then方法中的参数也是个回调函数 此时就会执行这个回调参数
// 当第二个回调参数被调用时，会调用new出来的这个对象下的catch方法，catch方法中参数也是个回调函数此时就会执行这个回调参数
const num = 1;
const promise = new Promise((resolve,reject) => {
console.log('当对象被创建时就会执行这个回调函数');
// 根据业务逻辑代码来调用回调参数
num === 1 ? resolve() : reject()
// 当执行resolve方法时 就会执行当前对象下的then方法
// 当执行reject方法时 就会执行当前对象下的catch方法
});
promise.then(res => {
console.log('当前num为1执行resolve方法，我被回调了')
});
promise.catch(res => {
console.log('当前num为其他值，执行reject方法，我被回调了')
});
// 当然也可以传参来实现数据传递
// 在调用Promise俩个回调函数时
resolve('实参');
reject('实参');
// 在对应的回调then catch中 就可以使用传递的实参
then( res => { // res 为形参 resolve调用时传递来的
console.log(res);
});
catch( err => { // err 为形参 reject调用时传递来的
console.log(err);
});
AsyncAwait异步处理机制
Async 会返回一个 Promise
如果消息队列中同时存在同级别的宏认为和微任务, 那么, 微任务优先执行
学习心得
通过这章学习了JavaScript的执行顺序
课程截图
随时随地看视频
