前言

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

原文地址:学习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. Android raw to bmp

    Android raw 格式转 bmp 图像 raw 保存的为裸数据,转换时都需要把它转成RGBA 的方式来显示.其中: 8位RAW: 四位RGBA 来表示一位灰度; 24位RAW: 三位RGB相同, ...

  2. IE8/9 JQuery.Ajax 上传文件无效

    IE8/9 JQuery.Ajax 上传文件有两个限制: 使用 JQuery.Ajax 无法上传文件(因为无法使用 FormData,FormData 是 HTML5 的一个特性,IE8/9 不支持) ...

  3. iOS controller解耦探究实现——第一次写博客

    大学时曾经做过android的开发,目前的工作是iOS的开发.之前自己记录东西都是通过自己比较喜欢的笔记类的应用记录下了.直到前段时一个哥们拉着我注册了一个博客.现在终于想明白了,博客这个东西受众会稍 ...

  4. 多线程条件通行工具——CountDownLatch

    CountDownLatch的作用是,线程进入等待后,需要计数器达到0才能通行. CountDownLatch(int)构造方法,指定初始计数. await()等待计数减至0. await(long, ...

  5. PHP设计模式(八)桥接模式(Bridge For PHP)

    一.概述 桥接模式:将两个原本不相关的类结合在一起,然后利用两个类中的方法和属性,输出一份新的结果. 二.案例 1.模拟毛笔(转) 需求:现在需要准备三种粗细(大中小),并且有五种颜色的比 如果使用蜡 ...

  6. jquery学习(一)

    简单的jquery学习,首先在页面引入jquery <!-- 引入jquery --> <script src="js/jquery-1.8.3.js" type ...

  7. Android之ContentProvider数据存储

    一.ContentProvider保存数据介绍 一个程序可以通过实现一个ContentProvider的抽象接口将自己的数据完全暴露出去,而且ContentProvider是以类似数据库中表的方式将数 ...

  8. Atitit.研发管理软件公司的软资产列表指南

    Atitit.研发管理软件公司的软资产列表指南 1. Isv模型下的软资产1 2. 实现层面implet1 3. 规范spec层1 4. 法则定律等val层的总结2 1. Isv模型下的软资产 Sof ...

  9. PLSql Oracle配置

    1.安装Oracle客户端或者服务端 2.配置环境变量 <1>.一般如果安装了Oracle客户端或者服务端的话,在环境变种的Path中有Oracle的安装路径(计算机-属性-高级系统设置- ...

  10. VIM教程

    vim 的环境设定参数 :set nu :set nonu             就是设定与取消行号啊! :set hlsearch :set nohlsearch     hlsearch 就是 ...