下面是一个理论上的模型，js引擎着重实现和优化了描述的这几个语义
可视化描述
test.jpg
栈(stack)
var a = 10;
function bar(x) {
var b = 5;
fn(x + b);
}
function fn(y) {
var c = 5;
}
bar(10);
js会以一种执行栈的方式去执行代码，以一种入栈和出栈的方式，后进先出的完成代码执行，用下图表示如下（上下文描述可以忽略，有兴趣的可以参考这篇文章，此文不作讲解）：
232125295149083.png
堆(heap)
简单点说，就是一块内存区域，用来存储声明的变量、对象，相比栈而言，它是无结构的，而栈(stack)是有结构的。
队列(queue)
一个js运行时包含了一个待处理的消息队列，每一个消息都与一个函数相关联。当栈(stack)拥有足够内存时，从队列中取出一个消息进行处理。这个处理过程包含了调用与这个消息相关联的函数（以及因而创建了一个初始堆栈帧）。当栈(stack)再次为空的时候，也就意味着消息处理结束。
在处理消息队列的时候，会涉及到事件循环(Event Loop)，在游览器中由事件触发线程进行，用下图很好的描述了整体结构：
bg2014100802.png
对事件循环的原理和js异步和线程感兴趣的，可以读读这篇文章
网友评论