你必须知道的Javascript知识点之"单线程事件驱动"的使用
更新时间：2013年04月23日 09:59:57 作者：
本篇文章小编为大家介绍，你必须知道的Javascript知识点之"单线程事件驱动"的使用。需要的朋友参考下
复制代码 代码如下:
var intervalBody = function(){
console.log('interval');
}
var startInterval = function(){
setInterval(intervalBody,1000);
}
var timeoutBody = function(){
console.log('timeout');
}
var startTimeout = function(){
setTimeout(timeoutBody,1000);
}
var sleep = function(second){
var current = new Date().setSeconds(new Date().getSeconds() + second);
while(new Date() < current){ }
}
startInterval();
startTimeout();
sleep(2);
console.log('sleep once');
sleep(2);
console.log('sleep again');
执行结果
事件驱动的单线程模型，所有javascript的代码都在一个线程中执行，javascript线程从事件队列中一次取出一个事件进行执行。
规则2宿主中除了javascript线程外，还有定时器线程（setInterval和setTimeout会触发这两个线程执行）、浏览器事件触发线程（这个线程会触发onclick、onmousemove和其它浏览器事件）、AJAX请求线程；所有这些线程触发的事件（回调）都会加入到事件队列的尾部。
规则3当浏览器加载完html文档后，会将当前html的所有的js代码作为事件队列的第一个事件，其它线程触发的事件（回调）都会加入到事件队列的尾部。
setTimeout和setInterval中的回调的执行时间肯定是大于为其指定的秒数。
浏览器渲染线程假如javascript执行线程执行了A事件，在A事件执行的过程中修改了DOM，这些DOM的修改不会立即反应到界面上，而是当A事件执行完毕后，javascript线程会被阻塞，这时浏览器渲染线程会渲染DOM的修改结果，等浏览器渲染线程执行完毕后，javascript线程才继续运行。
代码示例
复制代码 代码如下:
var sleep = function(second){
var current = new Date().setSeconds(new Date().getSeconds() + second);
while(new Date() < current){ }
}
document.body.innerHTML = '段光伟';
sleep(5);
相关文章
前后台用js传参过程中,如果是中文就容易出现乱码,下面这篇文章主要给大家介绍了关于js解决url传递中文参数乱码问题的的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下2023-05-05
本文为大家介绍下如何使用js捕获鼠标滚轮事件，原理很简单，感兴趣的朋友可以参考下2013-12-12
这篇文章主要为大家详细介绍了js实现拖拽功能,具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-11-11
这篇文章主要为大家介绍了javascript跑马灯抽奖特效，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-01-01
下面小编就为大家带来一篇window.open不被拦截的简单实现代码(推荐) 。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-08-08
javascript中的altKey 和 Event属性大全
本文给大家介绍javascript中的altkey和event属性大全，涉及到altkey和event属性语法定义及用法，本文介绍的非常详细，感兴趣的朋友一起看看吧2015-11-11
原生JavaScript实现精美的淘宝轮播图效果示例【附demo源码下载】
这篇文章主要介绍了原生JavaScript实现精美的淘宝轮播图效果,结合完整实例形式详细分析了javascript实现淘宝轮播图功能的相关HTML布局、css及js核心功能代码,并附带demo源码供读者下载参考,需要的朋友可以参考下2017-05-05
栈内存主要用于存储各种基本类型的变量，包括Boolean、Number、String、Undefined、Null，以及对象变量的指针（地址值），这篇文章主要介绍了JS堆栈内存的运行机制,需要的朋友可以参考下2022-06-06
window.name代替cookie的实现代码，需要的朋友可以参考下。2010-11-11
在开发项目的过程中，我们经常会需要关于javascript数组的一些算法，比方说数组去重、数组求交集、数组扰乱等等。今天就把个人的汇总整理的算法分享给大家。2016-02-02
最新评论