前端细节大全（二）：javascript关于数组栈和队列的细节分析

 导读

            在开始讲之前，我们都必须明白的一点就是栈和队列数据进出的方式：栈是先进后出的，队列是先进先出的。在数据结构中，这两个算法模式都是很常见或者说最基础和最重要的一部分，数据如何存储的，都基本离不开栈和队列。但是js中的栈和队列和一般的语言有一些区别，实际上就好像把队列看成栈一样，实际上还是有差别的并且遵循的原理也依然没有变。

---

 一、js中的数组栈和队列

 

发现问题：

	var stack=[];
	
	stack.push("a");
	stack.push("b");
	stack.push("c");
	
	console.log(stack.pop());
	console.log(stack.pop());
				
		
	var queue = [];
	
	queue.unshift("a");
	queue.unshift("b");
	queue.unshift("c");
	
	console.log(queue.shift());
	console.log(queue.shift());

              结果输出：                 

                                                            

 

               上面是出现疑问的代码，首先对于栈而言，就是输出cb没有任何疑问。但是为什么队列也是输出cb呢?接下来看我们的解释。

 

---

1.栈

    首先，栈是先进后出的，例如现在给出一组一维数组为[a,b,c],

 

                               

                       压栈顺序应该是abc

                                     

                          出栈顺序为：cba。 

总结：
                 栈，在js中的栈中存入值是从头部插入数据的，在尾部输出或者拿走数据，此时a的左边就像被堵住了，必须要在右边拿数据，这是因为是栈的特性必须遵循先进后出的原理。这个相信很多人都懂，也很多人能够理解，先进后出嘛，就是最先进入的数据就最后才出来的意思，在图和逻辑上基本是和平常人思维一致的，但是到js的数组队列中就发现一个问题了。

---

2.队列

             同样进入三个值abc，假设和栈的数组一样，从左往右阅读。

            队列从尾部插入数据

                                                 

            出去的顺序为：cba。从头部出来数据。

                                            

   总结： 

             此时很多人都会觉得真的是这样的吗？其实在内存阅读程序过程中，受到队列和栈的算法影响，阅读顺序有所差别。队列是从尾部插入数据，从头部输出数据会更加好理解。

---

  二、深入js数组栈和堆理解

             首先，js中的队列我们不能用一种惯性思维去理解，当然队列算法的原理完全没有问题的，所以也不存在算法逻辑上的错误。实际上，在js中的栈中存入值是从头部插入数据的，最先进入栈里的值会顶到最后面出来的拿一个位置。                      

                    如图所示：

                                    

所以a最先进入被顶入最左边，最左边封顶，a是最后一个值，此时如果输出值就会拿出cba值。

                                                            

  

                               

 

和栈的区别就是队列中，a的最左边不封顶，被数值顶入队列中，也就是在a左边还有可能还有更多的数值，a不是最后一个值。因为现在内存阅读从右边开始拿数据，那么输出也是和栈一致是cba。

---

自我感想：

            队列和栈在js中都有不同的表现，这些表现也许我们还是相当疑惑的。我们都知道队列和栈的算法原理，但是实际上我们在操作过程中会存在很多疑问，解决这些疑问，就是我们提高我们的硬实力的绝佳路径。

 

 

 

谢谢大家~❤