阅读 938

深入理解javascript系列(一):从三种数据结构开始

    在Javascript中,有三种常用的数据结构是我们必须了解的。它们分别是栈(stack)、堆(heap)、队列(queue)。它们是我们理解javascript核心的基础。栈、堆、队列对应不同的应用场景。

1.1  栈

    当我们遇到栈的时候,可能会是不同的栈。什么意思了?我们先必须理清不同应用场景下的栈。

    场景1:栈是一种数据结构,表示的是数据的一种存储方式,这是一种理论基础。

    场景2:栈是可用来规定代码的执行顺序,在javascript中叫做函数调用栈(call stack),他是根据栈数据结论理论的一种实践。

    场景3:栈表达的是一种数据在内存中的存储区域,通常叫做作栈区。但是javascript并没有想别语言那样区分栈区和堆区。因此这里不做扩展。我们可以简单粗暴的认为在javascript中,所有的数据都是存放在堆内存空间中的。

    这里需要我们理解栈这种数据结构的原理和特点,学习它的最终目的是掌握函数调用栈的运行方式。下面我们通过兵乓球盒这个案例来放便理解栈的存取方式。


    如图所示,兵乓球盒中依次放入兵乓球,当我们想取出兵乓球时,必须从顶部一个一个的拿出,直到取到我们第一个放入的兵乓球。

    这种情况与栈的数据结构如出一辙。这中存取方式可以总结为“先进后出,后进先出(LIFO,Last In,First Out)"。如图中的,出于栈顶的true,最后进栈,最先出栈。1在栈底,最先进的栈,但只能最后出栈。

   在javascript中,数组(Array)提供了两个栈方法来对应这种存取方式。

   push:向数组末尾添加元素(进栈方法)

    push方法可以接收任意参数,并把他们逐个添加到数组的末尾,并放回数组的长度。

var a = [];
a.push(1);            //a:[1]
a.push(2,3,4);        //a:[1,2,3,4]
var l = a.push(5)     //a:[1.2.3.4.5]     l:5复制代码

    pop:弹出数组末尾的一个元素

    pop删除数组末尾的一个元素,并返回。

var a = [1,2,3];
a.pop();    //a:[1,2]
a.pop()的返回结果为3复制代码

1.2  堆

堆数据是一种树形结构

他的存取方式与从书架中取书相似。书齐地摆放在书架上,我们只要清除我们要在哪本书(知道书名)就能准确的找到我们想要的书。我们不用关系书的摆放顺序,即不用想兵乓球盒那样,必须将一些兵乓球取出来才能拿到我们想拿到的。

因为GC的存在,所以JavaScript中无法直接用堆的方式申请内存(类似的情况在Java中也存在),但是我们可以参考JSON格式的数据,或者数组对象,我们存储的key-value可以是无序的,因为顺序的不同并不影响我们的使用,我们只需要关心书的名字。我们操作的都栈的对象。

1.3  队列

在javascript中,理解队列数据结构的目的是为了搞清楚事件循环(Event Loop)机制到底怎么回事。之后的系列会讲事件循环。

队列(queue)是一种先进先出的(FIFO)数据结构。正如排队过安检一样,排在队伍前面的人一定是最先过安检的人。原理如图:


记住:兵乓球盒(栈)、书架取书(堆)、排队进站(队列)


文章分类
前端