JS采用单线程模式工作的原因
JavaScript的执行环境是单线程执行,因为JS语言是最早是运行再浏览器的语言,主要目的是为了现实动态交互。实现动态交互的核心就是DOM操作,因此决定了JS必须是单线程模式工作。假设JS是多线程一起工作的,一个线程修改了一个DOM元素,另外一个线程是要删除这个DOM元素,可能会冲突,因为不明确以哪个线程为准。(注:浏览器是多线程)
EventLoop事件循环和消息队列
- EventLoop是一种循环机制,主线程从消息队列中读取任务并按照顺序执行,这个过程是循环不间断的。
- 消息队列是存放异步任务的地方,当我们的同步任务都执行完毕后,EventLoop会从消息队列中依次取出异步任务放到调用栈中进行执行。
宏任务和微任务
- 宏任务可以理解为每次执行栈执行的代码就是一个宏任务
浏览器为了让JS内部宏任务与DOM操作能够有序的执行,会在一个宏任务执行结束后,下一个宏任务执行开始前,对页面进行重新渲染。
宏任务包括:script整体代码、setTimeout、setInterval、I/O、UI交互事件、MessageChannel等。
- 微任务可以理解为每个宏任务执行结束后立即执行的任务,发生在宏任务后,渲染之前,执行微任务。
所以微任务的响应速度相比宏任务会更快,因为无需等待UI渲染
微任务包括:Promise.then、MutaionObserver、process.nextTick(Node.js环境下)等。
异步编程方案的本质—回调函数
回调函数:由调用者定制,交给执行者执行的函数。
我们通过 callback 回调函数、事件发布/订阅、Promise 等来组织代码,本质都是通过回调函数来实现异步代码的存放与执行。
// callback就是回调函数 // 就是把函数作为参数传递,缺点是不利于阅读,执行顺序混乱。 function foo(callback) { setTimeout(function(){ callback() }, 3000) } foo(function() { console.log('这是回调函数') console.log('调用者定义这个函数,执行者执行这个函数') console.log('其实就是调用者告诉执行者异步任务结束后应该做什么') })
更优异步编程统一方案——Promise
Promise基本用法
// Promise 基本示例 // promise的英文意思是承诺 // 在JS中Promise是一个对象,接收一个函数作为参数 const promise = new Promise(function (resolve, reject) { // 这里用于“兑现”承诺 // resolve(100) // 承诺达成 reject(new Error('promise rejected')) // 承诺失败 }) promise.then(function (value) { // 即便没有异步操作,then 方法中传入的回调仍然会被放入队列,等待下一轮执行 console.log('resolved', value) }, function (error) { console.log('rejected', error) })
Promise的链式调用
链式调用的理解
- promise对象then方法,返回了全新的promise对象。可以再继续调用then方法,如果return的不是promise对象,而是一个值,那么这个值会作为resolve的值传递,如果没有值,默认是undefined
- 后面的then方法就是在为上一个then返回的Promise注册回调
- 前面then方法中回调函数的返回值会作为后面then方法回调的参数
- 如果回调中返回的是Promise,那后面then方法的回调会等待它的结束
- 版权声明:本文基于《知识共享署名-相同方式共享 3.0 中国大陆许可协议》发布,转载请遵循本协议
- 文章链接:https://www.imiowo.com/639.html [复制] (转载时请注明本文出处及文章链接)
又是元气MAX的一天(●'◡'●)
作者:洛斯介绍:大西瓜
文章:52篇
最后更新:23-11-01
介绍:大西瓜
文章:52篇
当前页面评论被关闭,原因如下:
发表评论