因为公司业务面向国企以及传统企业,所以代码需要能够在ie9以上运行,所以在项目中无法用一些新技术。比如ES6的Promise,这个Promise真的是太好使了,就跟便秘时使了开塞露一般。由于Promise太好使了,所以这两天想着能不能用ES5实现Promise。在网上搜到了很多关于ES5实现Promise的文章,大部分都是说需要先明白JavaScript的时间循环机制。正好这块我以前也不是非常明白,这次也正好仔细学习一下。

JavaScript是一种单线程非阻塞的语言。单线程就是指代码在执行的时候,只有一个线程来处理所有任务。非阻塞则指的是当代码在执行一项无法立即返回结果的任务时,就会先将这个任务挂起(pending),待到其他这个任务返回结果后再按照一定的规则进行操作。其实非阻塞就是用异步操作来完成的。用代码可以表示成:

console.log(1);

setTimeout(function(){

console.log(2);

},1000);

console.log(3);

这段代码就是一个用异步操作来实现非阻塞的例子。代码最后执行结果是1 3 2。这段代码翻译下来就是:首先在控制台答应1,打印完了之后就会执行setTimeout方法,这个方法是计时1000毫秒,这个1000毫秒就表示无法立即返回执行的结果,所以此时会将setTimeout方法挂起,挂起后setTimeout就会自顾自计时去了。主线程将将setTimeout挂起后就继续执行后边的语句去了,所以会在控制台打印3。现在主线程上的任务都已经处理完了,待setTimeout计完时,就是执行其回调函数,也就是在控制台打印2。

说回JavaScript的事件循环。JavaScript执行方法的时候,会生成一个执行环境,这个环境满足了执行这个方法的条件。当遇到一系列的方法后,就会将遇到的方法,依次添加到执行栈。当JavaScript第一次执行时,主线程会将所有的同步代码按照执行顺序添加到执行栈中。当遇到的这个代码是个方法时,就会将这个方法的执行环境添加到执行栈中,然后进入这个执行环境,执行方法中的所有代码。执行完了之后就会退出这个执行环境并销毁这个环境,然后就继续执行执行栈中的下一个语句。当主线程执行代码时遇到一个异步代码时,就会将其挂起,期间继续执行执行栈中的语句。当这个挂起的方法执行结束之后,结束后的方法并不会立即添加到当前的执行栈中,而是将这个方法添加到了事件列表中,当执行栈中的代码全部执行完了之后,主线程就会去事件列表里执行里边已经有的方法。

console.log(1);

setTimeout(function(){

console.log(2000);

},2000);

setTimeout(function(){

console.log(1000);

},1000);

console.log(3);

上边这段代码执行时,会先将console.log(1)添加到执行栈,然后就遇到了第一个setTimeout,这是一个异步操作,所以将其挂起执行,挂起后主线程就继续往下执行,又是一个异步操作,所以继续挂起执行,然后主线程继续执行,这会不是异步操作,所以将这个console.log(3)添加到执行栈。暂时先不管执行栈里的代码有没有执行,先看看之前挂起的两个方法,计时时间为1000毫秒的当然先执行完,这个时候就将其回调函数添加进事件列表,等待执行。然后计时2000毫秒的也计完时了,他的回调函数也就进入了事件列表。上边也说了,主线程会在将执行栈里的代码全部执行完了之后再去执行事件列表里的代码。所以会先在控制台打印1 3,这时执行栈里的代码就全部执行完了,然后主线程就去执行事件列表里的代码。这时就会先将事件列表里的第一个代码放到执行栈里,再将第二个代码放进执行栈。所以就先后打印出1000和2000。如果回调里套异步,异步的回调里套异步。这时候主线程就会在执行栈和时间列表一直跑,从而形成了一个循环,这就是事件循环机制了。

事件循环机制就是这样。以上文字供我自己之后参考,掺杂大量个人理解和口语化表达,难免和官方有所偏差,一切以官方或大佬为准。

es5如何实现promise_ES5实现Promise(1) - 事件循环机制相关推荐

  1. js的事件循环机制:同步与异步任务(setTimeout,setInterval)宏任务,微任务(Promise,process.nextTick)...

    javascript是单线程,一切javascript版的"多线程"都是用单线程模拟出来的,通过事件循环(event loop)实现的异步. javascript事件循环 事件循环 ...

  2. jsp循环输出表格_「翻译」JS可视化学习之七:Promise、事件循环和异步2

    喜欢排队吧,它能保护你的时间和精力 - 排队纪律维护员Event Loop Promise和事件循环概览图 请注意上面这张图,Promise和事件循环的那些事,将在这个图上缓缓展开. 微任务和(宏)任 ...

  3. 事件循环机制EventLoop

    事件循环机制EventLoop Event Loop即事件循环,是解决javaScript单线程运行阻塞的一种机制. 一.EventLoop的相关概念 1.堆(Heap) 堆表示一大块非结构化的内存区 ...

  4. boost log 能不能循环覆盖_前端基础进阶(十四):深入核心,详解事件循环机制...

    Event Loop JavaScript的学习零散而庞杂,很多时候我们学到了一些东西,但是却没办法感受到进步!甚至过了不久,就把学到的东西给忘了.为了解决自己的这个困扰,在学习的过程中,我一直在试图 ...

  5. JS事件循环机制:同步与异步任务 之 宏任务 微任务

    JS事件循环机制:同步与异步任务 之 宏任务 微任务 阅读目录 javascript事件循环 setTimeout和setInterval中的执行时间 宏任务和微任务 javascript是单线程,一 ...

  6. 事件循环机制 + ES7:Async/Await(基于generator原理实现)附详细示例分析

    文章目录 一.事件循环 任务队列 宏任务和微任务 循环机制 简单示例 二.Async/Await 1. async 2. await 3. 原理 4. 示例(红字分析为关键) 一.事件循环 任务队列 ...

  7. 浏览器中的事件循环机制

    浏览器中的事件循环机制 网上一搜事件循环, 很多文章标题的前面会加上 JavaScript, 但是我觉得事件循环机制跟 JavaScript 没什么关系, JavaScript 只是一门解释型语言, ...

  8. 浏览器事件循环机制与Vue nextTick的实现

    浏览器事件循环机制 先上一段简单的代码 console.log('aa'); setTimeout(() => { console.log('bb')}, 0); Promise.resolve ...

  9. js结束当前循环关键词_干货||什么是事件循环机制

    事件循环机制 经常有小伙伴问到我什么是 js 的事件循环机制,这里我就简单来给这些有困惑的小伙伴进行一下解答. 我将从下面几个方面来循序渐进的为大家来进行讲解: 区分进程和线程 浏览器的多进程 浏览器 ...

最新文章

  1. DNS反射放大攻击分析——DNS反射放大攻击主要是利用DNS回复包比请求包大的特点,放大流量,伪造请求包的源IP地址为受害者IP,将应答包的流量引入受害的服务器...
  2. Framework7 4.1.0 发布,全功能 HTML 框架
  3. 对于反射的一些总结(一)
  4. php 嵌套函数公式解析,Pyparsing,使用嵌套解析器解析php函数注释块的内容
  5. JS学习总结(9)——String
  6. 7个碎片的excel重组实验
  7. vi单文件操作常用命令
  8. 操作系统学习笔记(一)
  9. 传感器自学笔记第四章——土壤湿度+雨滴模块
  10. SCDM学习笔记(4)
  11. 最新版X-Helios、X-Medusa、X-Ladon、X-Argus逆向与风控分析
  12. KV杀毒软件创始人离世
  13. 什么是绿色工厂?什么企业可以申报绿色工厂?
  14. axios的get请求禁止缓存
  15. vanish(squid) + HAProxy + nginx + memcached(redis)
  16. Axure 9如何制作自己的元件库
  17. 题解-今日头条2018校招后端方向(第四批)
  18. 兰州理工大c语言成绩,中国甘肃网:第三轮学科评估结果公布 兰州理工大16门学科上榜...
  19. 节能低电压电机驱动芯片TMC2300
  20. C++,Qt开发的通讯录列表控件

热门文章

  1. Hough 圆变换----Matlab实现
  2. express使用JWT和httpOnly cookie进行安全验证
  3. Django数据查询方法总结
  4. NLP应该如何学、如何教?斯坦福大学大牛Dan Jurafsky教授专访
  5. 继承MonoBehaviour类的优缺点和相关报错
  6. linux禁用IPv6地址
  7. NUMA与英特尔下一代Xeon处理器学习心得(4)
  8. hough变换检测圆周_一文解读经典霍夫变换(Hough Transform)
  9. 【君义精讲】多种方法求斐波那契数列
  10. 信息学奥赛一本通(2060:【例1.1】计算机输出)