JavaScript多线程详解


Posted in Javascript onAugust 12, 2015

虽然有越来越多的网站在应用AJAX技术进行开发,但是构建一个复杂的AJAX应用仍然是一个难题。

造成这些困难的主要原因是什么呢?是与服务器的异步通信问题?还是GUI程序设计问题呢?通常这两项工作都是由桌面程序来完成的,那究竟为何开发一个可以实现同样功能的AJAX应用就这么困难呢?

大家都知道javascript是单线程执行的,但是又可以通过setTimeout或者setInterval定时执行一个方法,通过Ajax可以在向服务器端发送请求没有收到回应可以继续执行主逻辑。这些是如何做到的呢,下面就来探讨下。

先看如下一段代码:

<html>
  <body>
  <script type="text/javascript">
    function printHello()
    {
      console.time("hello");
    }
    function printHello1()
    {
      console.timeEnd("hello");
    }
    setTimeout(printHello,1000);
    setTimeout(printHello1,5000);
    function wait(time)
    {
      var now = Date.now();
      while(Date.now() - now < time)
      {
      }
    }
    wait(5000);
  </script>
  </body>
</html>

以上代码得执行结果为

hello: 0.124ms

从代码可以看出,printHello 与printHello1几乎是同时执行的。如果对于多线程模型,应该执行间隔是4000ms。

以上的原因是setTimeout只是将事件到时间点压入队列,而不是立即执行。具体何时执行还要看浏览器的空闲程度。

其实虽然javascript是单线程的,但是浏览器是多线程的,典型的浏览器有如下线程:

javascript引擎线程
界面渲染线程
浏览器事件触发线程
Http请求线程

javascript单线程指的是javascript引擎线程单线程处理它的事件队列,而浏览器是事件驱动的,很多事件都是异步的,比如鼠标点击事件,setTimeout,Ajax回调事件,当这些事件发生时,浏览器会将这些事件放入执行队列,待浏览器空闲时再执行。

另外,值得一提的是,ajax调用确实是异步的,浏览器会启动一个新线程来想服务端发送请求,如果设置了回调事件,会根据服务端返回状态将回调事件放入事件队列。

以上所述是本人对JavaScript多线程的理解,个人理解能力有限,还望各位大侠提成宝贵意见,共同学习。希望以上介绍对大家有所帮助。

Javascript 相关文章推荐
jquery如何判断某元素是否具备指定的样式
Nov 05 Javascript
javascript实现节点(div)名称编辑
Dec 17 Javascript
ExtJs动态生成treepanel的Json格式
Jul 19 Javascript
jQuery网页右侧广告跟随滚动代码分享
Apr 20 Javascript
Javascript 判断两个IP是否在同一网段实例代码
Nov 28 Javascript
JS完成画圆圈的小球
Mar 07 Javascript
vue2.0构建单页应用最佳实战
Apr 01 Javascript
JS实现加载和读取XML文件的方法详解
Apr 24 Javascript
纯js实现动态时间显示
Sep 07 Javascript
vue组件传递对象中实现单向绑定的示例
Feb 28 Javascript
Vue 中 a标签上href无法跳转的解决方式
Nov 12 Javascript
基于Vue全局组件与局部组件的区别说明
Aug 11 Javascript
javascript实现在下拉列表中显示多级树形菜单的方法
Aug 12 #Javascript
JavaScript实现同一页面内两个表单互相传值的方法
Aug 12 #Javascript
JavaScript实现点击单选按钮改变输入框中文本域内容的方法
Aug 12 #Javascript
JavaScript检测并限制复选框选中个数的方法
Aug 12 #Javascript
JavaScript入门基础
Aug 12 #Javascript
js实现将选中值累加到文本框的方法
Aug 12 #Javascript
javascript实现简单的分页特效
Aug 12 #Javascript
You might like
php+mysql开源XNA 聚合程序发布 下载
2007/07/13 PHP
解析PHP跨站刷票的实现代码
2013/06/18 PHP
免费的ip数据库淘宝IP地址库简介和PHP调用实例
2014/04/08 PHP
PHP中exec函数和shell_exec函数的区别
2014/08/20 PHP
CI框架中site_url()和base_url()的区别
2015/01/07 PHP
JS 创建对象(常见的几种方法)
2008/11/03 Javascript
jquery 实现的全选和反选
2009/04/15 Javascript
jquery multiSelect 多选下拉框
2010/07/09 Javascript
MooTools 页面滚动浮动层智能定位实现代码
2011/08/23 Javascript
js处理自己不能定义二维数组的方法详解
2014/03/03 Javascript
JavaScript中对象属性的添加和删除示例
2014/05/12 Javascript
window.location 对象所包含的属性
2014/10/10 Javascript
JSONP跨域GET请求解决Ajax跨域访问问题
2014/12/31 Javascript
js实现的牛顿摆效果
2015/03/31 Javascript
jQuery平滑旋转幻灯片特效代码分享
2015/09/07 Javascript
JS+CSS实现另类带提示效果的竖向导航菜单
2015/10/15 Javascript
基于javascript实现最简单的选项卡切换效果
2016/05/16 Javascript
详细谈谈AngularJS的子级作用域问题
2016/09/05 Javascript
JS IOS/iPhone的Safari浏览器不兼容Javascript中的Date()问题如何解决
2016/11/11 Javascript
JS识别浏览器类型(电脑浏览器和手机浏览器)
2016/11/18 Javascript
AngularJS模态框模板ngDialog的使用详解
2018/05/11 Javascript
Vue下路由History模式打包后页面空白的解决方法
2018/06/29 Javascript
分享5个小技巧让你写出更好的 JavaScript 条件语句
2018/10/20 Javascript
详解微信小程序图片地扯转base64解决方案
2019/08/18 Javascript
vue通过v-html指令渲染的富文本无法修改样式的解决方案
2020/05/20 Javascript
Python实现将文本生成二维码的方法示例
2017/07/18 Python
使用Turtle画正螺旋线的方法
2017/09/22 Python
python 接口返回的json字符串实例
2018/03/27 Python
Tensorflow 自定义loss的情况下初始化部分变量方式
2020/01/06 Python
解决Tensorflow2.0 tf.keras.Model.load_weights() 报错处理问题
2020/06/12 Python
Python3.8安装Pygame教程步骤详解
2020/08/14 Python
用python计算文件的MD5值
2020/12/23 Python
eBay奥地利站:eBay.at
2019/07/24 全球购物
经贸日语专业个人求职信范文
2014/04/29 职场文书
历史名人教你十五个读书方法,赶快Get起来!
2019/07/18 职场文书
Docker与K8s关系介绍不会Docker也可以使用K8s
2022/06/25 Servers