前言

只要你不计较得失,人生还有什么不能想法子克服的。

原文地址:学习javascript数据结构(一)——栈和队列

博主博客地址:Damonare的个人博客

几乎所有的编程语言都原生支持数组类型,因为数组是最简单的内存数据结构。javascript也有数组类型,而数组呢,其实就是一种特殊的栈或是队列,利用javascript Array所内置的API可以很方便的模拟栈和队列。

正文

我想对于数组每一个学过编程语言的都不会陌生吧,我们知道,我们可以在数组的任意位置添加或是删除元素,然而,有时候我们还需要一种在添加或是删除元素的时候有更多控制的数据结构。有两种数据结构类似于数组。但在添加或是删除元素的时候更为的可控。他们就是栈和队列。

栈是一种遵从后进先出(LIFO)原则的有序集合。新添加的或是待删除的元素都保存在栈的末尾。我们称作栈顶,而另一端我们称作栈底。

在现实生活中就有很多栈的例子,比如下图的书本,这一摞书如果要取肯定是先去最上面的那一本,但它是最后一个放上去的,也就是栈顶的元素都是待添加或是待删除的。这就是后进先出的实际例子。

栈的创建

首先我们先创建一个类:

function Stack(){
//各种属性和方法的声明
}

然后我们需要一种数据结构来保存栈里面的数据:

var items=[];

接下来,我们需要给栈声明一些方法:

  • push(element):添加一个或是几个新元素到栈顶。
  • pop():移除栈顶的元素,同时返回被移除元素。
  • peek():返回栈顶的元素,但并不对栈顶的元素做出任何的修改。
  • isEmpty():检查栈内是否有元素,如果有返回true,没有返回false。
  • clear():清除栈里的元素。
  • size():返回栈的元素个数。
  • print():打印栈里的元素。

栈的完整代码

我们通过javascript提供的API,实现栈如下:

function Stack() {

    var items = [];

    this.push = function(element){
items.push(element);
}; this.pop = function(){
return items.pop();
}; this.peek = function(){
return items[items.length-1];
}; this.isEmpty = function(){
return items.length == 0;
}; this.size = function(){
return items.length;
}; this.clear = function(){
items = [];
}; this.print = function(){
console.log(items.toString());
}; this.toString = function(){
return items.toString();
};
}

使用栈

创建完了栈,也给他了方法,然后我们来实例化一个对象:

var stack=new Stack();
console.log(stack.isEmpty());
//true
stack.push(1);
stack.push(3);
//添加元素
console.log(stack.peek());
//输出栈顶元素3
console.log(stack.size());
//2
//输出元素个数

其余方法调用读者可自行尝试。

队列

我们已经接触了栈,接下来要说的队列和栈十分相似,他们都是线性表,元素都是有序的

。队列和栈不同的是,队列遵循的是FIFO,也就是先进先出的原则。队列从尾部添加新元素,从顶部移除元素,最新添加的元素必须排列在队列的末尾。


在现实生活中,最常见的队列就是排队,如下图,先进入队列的先接受服务,后进入队列的必须排在队列末尾。

队列的创建

首先我们声明一个类:

function(){
//这里是队列的属性和方法
}

然后我们同样创建一个保存元素的数组:

var items=[];

接下来声明一些队列可用的方法:

  • enqueue(element):向队列尾部添加一个(或是多个)元素。
  • dequeue():移除队列的第一个元素,并返回被移除的元素。
  • front():返回队列的第一个元素——最先被添加的也是最先被移除的元素。队列不做任何变动。
  • isEmpty():检查队列内是否有元素,如果有返回true,没有返回false。
  • size():返回队列的长度。
  • print():打印队列的元素。

队列的完整代码

我们通过javascript提供的API,实现队列如下:

function Queue() {

    var items = [];

    this.enqueue = function(element){
items.push(element);
}; this.dequeue = function(){
return items.shift();
}; this.front = function(){
return items[0];
}; this.isEmpty = function(){
return items.length == 0;
}; this.clear = function(){
items = [];
}; this.size = function(){
return items.length;
}; this.print = function(){
console.log(items.toString());
};
}

使用队列

创建完了队列,也给他了方法,然后我们来实例化一个对象:

var queue=new Queue();
console.log(queue.isEmpty());
//true
queue.enqueue(1);
queue.enqueue(3);
//添加元素
console.log(queue.front());
//返回队列的第一个元素1
console.log(queue.size());
//2
//输出元素个数

后记

这篇博客使用javascript实现了栈和队列这两种数据结构。关于具体的应用的有机会补上。

学习javascript数据结构(一)——栈和队列的更多相关文章

  1. 学习javascript数据结构(二)——链表

    前言 人生总是直向前行走,从不留下什么. 原文地址:学习javascript数据结构(二)--链表 博主博客地址:Damonare的个人博客 正文 链表简介 上一篇博客-学习javascript数据结 ...

  2. 学习javascript数据结构(四)——树

    前言 总括: 本文讲解了数据结构中的[树]的概念,尽可能通俗易懂的解释树这种数据结构的概念,使用javascript实现了树,如有纰漏,欢迎批评指正. 原文博客地址:学习javascript数据结构( ...

  3. 重读《学习JavaScript数据结构与算法-第三版》- 第5章 队列

    定场诗 马瘦毛长蹄子肥,儿子偷爹不算贼,瞎大爷娶个瞎大奶奶,老两口过了多半辈,谁也没看见谁! 前言 本章为重读<学习JavaScript数据结构与算法-第三版>的系列文章,主要讲述队列数据 ...

  4. 重读《学习JavaScript数据结构与算法-第三版》- 第4章 栈

    定场诗 金山竹影几千秋,云索高飞水自流: 万里长江飘玉带,一轮银月滚金球. 远自湖北三千里,近到江南十六州: 美景一时观不透,天缘有分画中游. 前言 本章是重读<学习JavaScript数据结构 ...

  5. 学习javascript数据结构(三)——集合

    前言 总括: 本文讲解了数据结构中的[集合]概念,并使用javascript实现了集合. 原文博客地址:学习javascript数据结构(三)--集合 知乎专栏&&简书专题:前端进击者 ...

  6. 学习JavaScript数据结构与算法 (一)

    学习JavaScript数据结构与算法 的笔记, 包含一二三章 01基础 循环 斐波那契数列 var fibonaci = [1,1] for (var i = 2; i< 20;i++) { ...

  7. javascript中的栈、队列。

                           javascript中的栈.队列 栈方法     栈是一种LIFO(后进先出)的数据结构,在js中实现只需用到2个函数 push()  接受参数并将其放置 ...

  8. 学习JavaScript数据结构与算法 (二)

    学习JavaScript数据结构与算法 的笔记 包含第四章队列, 第五章链表 本人所有文章首发在博客园: http://www.cnblogs.com/zhangrunhao/ 04队列 实现基本队列 ...

  9. 学习JavaScript数据结构与算法---前端进阶系列

    学习建议 1.视频学习---认知 建议:在中国慕课上找"数据结构"相关的视频教程.中国大学MOOC 推荐清华大学.北京大学.浙江大学的教程,可先试看,然后根据自身的情况选择视频进行 ...

随机推荐

  1. 【Win 10 应用开发】在App所在的进程中执行后台任务

    在以往版本中,后台任务都是以独立的专用进程来运行,因此,定义后台任务代码的类型都要位于 Windows 运行时组件项目中. 不过,在14393中,SDK 作了相应的扩展,不仅支持以前的独立进程中运行后 ...

  2. 伪共享(false sharing),并发编程无声的性能杀手

    在并发编程过程中,我们大部分的焦点都放在如何控制共享变量的访问控制上(代码层面),但是很少人会关注系统硬件及 JVM 底层相关的影响因素.前段时间学习了一个牛X的高性能异步处理框架 Disruptor ...

  3. How those spring enable annotations work--转

    原文地址:http://blog.fawnanddoug.com/2012/08/how-those-spring-enable-annotations-work.html Spring's Java ...

  4. ls: 无法访问/usr/sbin/smartctl: 没有那个文件或目录

    环境:RHEL6.5 + Oracle 11.2.0.4 RAC 在安装RAC时,检查时缺少包 cvuqdisk-1.0.9-1,oracle提供脚本修复安装. 但在执行时报错: [root@orad ...

  5. BAT“搅局”B2B市场,CIO们准备好了吗?

    "CIO必须灵活构建其所在企业的IT系统,深入业务,以应对日新月异的数字化业务环境."   BAT军团"搅局"B2B市场,CIO们准备好了吗? 庞大的企业级市场 ...

  6. AEAI DP V3.6.0 升级说明,开源综合应用开发平台

    AEAI DP综合应用开发平台是一款扩展开发工具,专门用于开发MIS类的Java Web应用,本次发版的AEAI DP_v3.6.0版本为AEAI DP _v3.5.0版本的升级版本,该产品现已开源并 ...

  7. 如何编译Zookeeper源码

    1. 安装Ant Ant下载地址:http://ant.apache.org/bindownload.cgi 解压即可. 2. 下载Zookeeper源码包 https://github.com/ap ...

  8. 不要着急改代码,先想想--centos 6.8下编译安装tmux

    诸位读者新年好,2017开年第一篇博客,请允许我先问候一下看到这篇博客的诸位.写博客是我2017年定下的目标之一,希望我会坚持下去. 最近打算尝试一下tmux这个神器,于是有了这一篇关于思维方式的Bl ...

  9. jsp富文本图片和数据上传

    好记性不如烂笔头,记录一下. 2016的最后一天,以一篇博客结尾迎接新的一年. 此处用的富文本编辑器是wangEditor,一款开源的轻量级的富文本编辑器,这里着重说一下里面的图片上传功能. 服务器端 ...

  10. 【腾讯Bugly干货分享】Android性能优化典范——第6季

    本文来自于腾讯bugly开发者社区,非经作者同意,请勿转载,原文地址:http://dev.qq.com/topic/580d91208d80e49771f0a07c 导语 这里是Android性能优 ...