前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >JavaScript事件驱动机制&定时器机制

JavaScript事件驱动机制&定时器机制

作者头像
奋飛
发布2019-08-15 10:21:49
1.1K0
发布2019-08-15 10:21:49
举报
文章被收录于专栏:Super 前端Super 前端

在浏览器中,事件作为一个极为重要的机制,给予JavaScript响应用户操作与DOM变化的能力;在NodeJS中,异步事件驱动模型则是提高并发能力的基础。

一、程序如何响应事件

程序响应外部的事件有两种方式:

1. 中断

操作系统处理键盘等硬件输入就是通过中断来进行的,这个方式的好处是即使没有多线程,我们也可以放心地执行我们的代码,CPU收到中断信号之后自动地转去执行相应的中断处理程序,处理完成后会恢复原来的代码的执行环境继续执行。这种方式需要硬件的支持,一般来说都会被操作系统封装起来。

2. 轮询

循环检测是否有事件发生,如果有就去执行相应的处理程序。这在底层和上层的开发中都有应用。

轮询方式的一个缺点就是:如果在主线程的消息循环里进行耗时操作,程序就无法及时响应新的消息。

二、JavaScript中定时器功能的特点

无论是Node还是浏览器中,都有setTimeout和setInterval这两个定时器函数,并且其工作特点基本相同。

JavaScript中的定时器并不同于计算机底层的定时中断。中断到来时,当前执行代码会被打断,转去执行定时中断处理函数。而JavaScript的定时器到时,如果当前执行线程没有正在执行的代码,则执行相应的回调函数;如果当前有代码在执行中,JavaScript引擎既不会中断当前代码转去执行回调,也不会开新的线程执行回调,而是当前代码执行完毕之后才去处理。

代码语言:javascript
复制
console.time("setTimoutLabel");	//标记时间开始
setTimeout(function() {
	console.timeEnd("setTimoutLabel");	//标记时间结束
}, 100);
for (var i = 0; i < 100000; i++) { }
代码语言:javascript
复制

执行上面的代码,可以看到最终输出的时间并不是100ms左右,而是数秒。这说明在循环完成之前,定时回调函数确实没有被执行,而是推迟到了循环结束。实际上在JavaScript代码执行中,所有的事件都无法得到处理,必须等到当前代码全部完成,才能去处理新的事件。这就是为什么在浏览器中运行耗时JavaScript代码时,浏览器会失去响应。

三、定时器的工作原理

1. javascript引擎只有一个线程,迫使异步事件只能加入队列去等待执行。

2. 在执行异步代码的时候,如果定时器被正在执行的代码阻塞了,它将会进入队列的尾部去等待执行直到下一次可能执行的时间出现(可能超过设定的延时时间)。setTimeout 和setInterval 是有着本质区别的:setTimeout 这段代码会在每次回调函数执行之后至少需要延时“指定延迟毫秒值”再去执行(可能是更多,但是不会少)。但是setInterval会每隔“指定延迟毫秒值”就去尝试执行一次回调函数,不管上一个回调函数是不是还在执行。

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2015年07月03日,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 一、程序如何响应事件
    • 1. 中断
      • 2. 轮询
      • 二、JavaScript中定时器功能的特点
      • 三、定时器的工作原理
      领券
      问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档