欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

javascript运行时中的堆栈和队列

程序员文章站 2022-04-18 12:47:33
...

下面是一个理论上的模型,js引擎着重实现和优化了描述的这几个语义

可视化描述

javascript运行时中的堆栈和队列

栈(stack)

var a = 10;
function bar(x) {
  var b = 5;
  fn(x + b);
}
function fn(y) {
  var c = 5;
}
bar(10);

js会以一种执行栈的方式去执行代码,以一种入栈和出栈的方式,后进先出的完成代码执行,用下图表示如下(上下文描述可以忽略,有兴趣的可以参考这篇文章,此文不作讲解):

javascript运行时中的堆栈和队列

堆(heap)

简单点说,就是一块内存区域,用来存储声明的变量、对象,相比栈而言,它是无结构的,而栈(stack)是有结构的。

队列(queue)

一个js运行时包含了一个待处理的消息队列,每一个消息都与一个函数相关联。当栈(stack)拥有足够内存时,从队列中取出一个消息进行处理。这个处理过程包含了调用与这个消息相关联的函数(以及因而创建了一个初始堆栈帧)。当栈(stack)再次为空的时候,也就意味着消息处理结束。

在处理消息队列的时候,会涉及到事件循环(Event Loop),在游览器中由事件触发线程进行,用下图很好的描述了整体结构:

javascript运行时中的堆栈和队列

对事件循环的原理和js异步和线程感兴趣的,可以读读这篇文章

参考链接