Loading [MathJax]/jax/output/CommonHTML/config.js
前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >[第 3 期]JavaScript数据结构之数组栈队列

[第 3 期]JavaScript数据结构之数组栈队列

作者头像
桃翁
发布于 2018-06-27 07:43:39
发布于 2018-06-27 07:43:39
59100
代码可运行
举报
文章被收录于专栏:前端桃园前端桃园
运行总次数:0
代码可运行

1. 数组

数组是平时使用最常用的数据结构,在JavaScript中数组是动态的分配大小,在这里我不会介绍JavaScript里面数组的所有的方法,而是针对数据结构这个方向谈谈所用到的方法。

1.1 创建和初始化数组

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
//创建空数组
var array = new Array();
//[]

//初始化数组
var array = new Array(1,2,3); 
var array = Array.of(1,2,3);//ES6的方法
//[1,2,3]

//创建大小为5的数组
var array = new Array();//ES6的方法
//[undefined,undefined,undefined,undefined,undefined]

//给数组赋值
var array = new Array();
array[0] = 1 ;
array[1] = 2 ;
array[2] = 3 ;
//[1,2,3]

1.2 添加元素

1.2.1往数组后添加元素
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
var number = [1,2,3];
number[number.length] = 4;
//[1,2,3,4]

//或者
var number = [1,2,3];
number.push(4);
//[1,2,3,4]
1.2.2往数组前面添加元素
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
var number = [1,2,3];
number.unshift(0);
//[0,1,2,3]
number.unshift(-2,-1);
//[-2,-1,0,1,2,3]
1.2.3往数组的任意位置插入元素

运用splice方法

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
//在索引1后面添加2,3,4
var number = [1,5,6];
number.splice(1,0,2,3,4);
//[1,2,3,4,5,6]

1.3 删除元素

1.3.1 删除第一位
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
var number = [1,2,3];
number.shift();
//[2,3]
1.3.2 删除任意位置

使用splice方法删除数组任意位置的元素

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
var numebr = [1,2,3,4,5,6];
//如果想删除元素3
number.splice(2,1);
//[1,2,4,5,6]

//如果想删除元素4,5
number.splice(3,2);

1.4 排序

1.4.1 反序
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
var number = [3,2,1];
number.reverse();
//[1,2,3]
1.4.2 自然排序
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
var numebr = [2,3,4,1,3,7];
number.sort();
//[1,2,3,3,4,7]
1.4.3 自定义排序

这个自定义排序跟java里面实现comparator接口一个意思。用处可大了。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
var number = [4,5,6,7,1,2,3,8,9,10,11,12,13];
number.sort();
//[1, 10, 11, 12, 13, 2, 3, 4, 5, 6, 7, 8, 9]

仿佛看起有点不对啊,我们应该想要的是 [1,2,3,4,5,6,7,8,9,10,11,12,13],这个时候我们就用自定义排序来解决这个问题

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
var number = [4,5,6,7,1,2,3,8,9,10,11,12,13];

function compare(a,b){
    if(a < b){
        return -1;
    }
    if(a > b){
        return 1;
    }

    return 0;
}

number.sort(compare);
//[1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13]

这还只是最简单的,也可以对任何对象类型进行数组排序。例如,对象Person有名字和年龄属性,我们希望根据年龄排序

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
var friends = [{name:'李晨',age:40},{name:'范冰冰',age:35}];

function comparePerson(a,b){
    if(a.age < b.age){
        return  -1;
    }
    if(a.age > b.age){
        return 1;
    }
    return 0;
}

friends.sort(comparePerson);
//[{name:'范冰冰',age:35},{name:'李晨',age:40}]

1.5 搜索

搜索有两个方法:indexOf方法返回与参数匹配的第一个元素的索引,lastIndexOf返回与参数匹配的最后一个元素的索引。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
var number = [1,3,4,3,56,6,7,4];
number.indexOf(3);//1
number.lastIndexOf(3)//3

2. 栈

栈是一种遵循后进先出(LIFO)原则的有序集合。新添加的或待删除的元素都保存在栈的末尾,称作栈顶,另一端就叫栈底。在栈里,新元素都靠近栈顶,旧元素都接近栈底。在JavaScript中变量保存和函数调用都是用栈存储的。

首先创建一个类来表示一个栈,需要一种数据结构来保存栈里的元素。这里我们就选择刚学的数组:var items = []; 接下来,为我们的栈声明一些方法:

  • push(elements(s)):添加一个(或几个)新元素到栈顶
  • pop():移除栈顶的元素,同时返回被移除的元素
  • peek():获取栈顶的元素,不对栈做出任何修改
  • isEmpty():如果栈里没有任何元素就返回true,否则返回false;
  • clear():清空栈
  • size():返回栈元素的个数

如果上一节数组认真看了,我相信用JavaScript实现一个栈是非常简单的。在这里就直接来代码了,不用一个方法一个方法去解释了。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
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 = funciton(){
        console.log(items.toString());
    }
}

3. 队列

队列是遵循先来先服务(FIFO)原则的一组有序的项。队列在尾部添加新元素,并从顶部移除元素。最新添加的元素排在队列的末尾。

在现实生活中常见的例子就是排队。 在计算机科学中,一个常见的例子就是打印队列,先点击打印的文档会被先打印。

3.1 创建队列

同样先创建一个类来表示一个队列。需要用到的数据结构同样是数组var items = []; 声明可用的方法:

  • enqueue(element(s)):向队尾添加一个(或多个)新的项
  • dequeue():移除队列的第一(即排在队列最前面的)项,并返回被移除的元素。
  • front():返回队列中第一个元素
  • isEmpty():如果队列中不包含元素返回true,否则返回false
  • size():返回队列包含元素的个数 完整的Queue类
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
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 = funciton(){
        return items.length;
    }

    this.print = function(){
        console.log(items.toString());
    }
}

3.2 优先队列

在优先队列中,元素被赋予优先级。当访问元素的时,具有最高优先级的元素先删除。优先队列具有最高进先出的行为特征。例如:医院的急救室为病人赋予优先级(这个优先级可以指病情严重的成程度),具有最高优先级的病人最先得到治疗。

实现一个优先队列有两种选项:

  1. 设置优先级,然后在正确的位置添加元素;
  2. 用入列操作添加元素,然后按照优先级移除它们。

我们这里采用第一种。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
function PriorityQueue(){
    var items = [];

    funciton QueueElement(element,priority){
        this.element = element;
        this.priority = priority;
    }

    function comparePriority(a,b){
        if(a.priority > b.priority){
            return 1;
        }

         if(a.priority < b.priority){
            return -1;
        }

        return 0;
    }

    this.enqueue = funciton(element,priority){
        var queueElement = new QueueElement(element,priority);

        items.push(queueElement);

        items.sort(comparePriority);
    }

    //其它方法和默认的Queue实现相同
}

当然,这个enqueue的实现方法很多种,我这效率不是最高的,但是容易理解。将插入的元素根据优先级排个序,那么先出去的就是优先级最高的了。

本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2018-03-28,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 前端桃园 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
JS数据结构与算法-队列
定义 队列是遵循FIFO(First In First Out,先进先出)原则的一组有序的项。 在现实中,最常见的队列的例子就是排队: 来自《javascript数据结构与算法》 创建队列 声明
Ewall
2018/09/04
8690
JS数据结构与算法-队列
JavaScript数据结构03 - 队列
队列是遵循FIFO(First In First Out,先进先出)原则的一组有序的项。队列在尾部添加新元素,并从顶部移除元素。最新添加的元素必须排在队列的末尾。
leocoder
2018/10/31
6290
用js来实现那些数据结构06(队列)
  其实队列跟栈有很多相似的地方,包括其中的一些方法和使用方式,只是队列使用了与栈完全不同的原则,栈是后进先出原则,而队列是先进先出(First In First Out)。 一、队列 队列是一种特殊的线性表,特殊之处在于它只允许在表的前端(front)进行删除操作,而在表的后端(rear)进行插入操作,和栈一样,队列是一种操作受限制的线性表。进行插入操作的端称为队尾,进行删除操作的端称为队头。队列中没有元素时,称为空队列。   队列的数据元素又称为队列元素。在队列中插入一个队列元素称为入队,从队列中删除
zaking
2018/05/02
1K0
javascript 队列
队列(Queue)是一种遵从先进先出(First in, first out。简称 FIFO)原则的有序集合。 它和栈的不同点是栈是先进后出的,队列是先进先出的,栈都是在一端进与出,而队列是在一端进在另一端出。栈的删除操作在表尾进行,队列的删除操作在表头进行。顺序栈能够实现多栈空间共享,而顺序队列不能。 共同点是只允许在端点处插入和删除元素。多链栈和多链队列的管理模式可以相同。
chuchur
2022/10/25
2960
JavaScript 数据结构与算法之美 - 线性表 (数组、栈、队列、链表)
笔者写的 JavaScript 数据结构与算法之美 系列用的语言是 JavaScript ,旨在入门数据结构与算法和方便以后复习。
夜尽天明
2019/07/10
1.4K0
JavaScript 数据结构与算法之美 - 线性表 (数组、栈、队列、链表)
从 0 开始学习 JavaScript 数据结构与算法(五)优先队列
场景 生活中类似优先队列的场景: 优先排队的人,优先处理。(买票、结账、WC)。 排队中,有紧急情况(特殊情况)的人可优先处理。 优先队列 优先级队列主要考虑的问题: 每个元素不再只是一个数据,还包含优先级。 在添加元素过程中,根据优先级放入到正确位置。 优先队列的实现 代码实现 // 优先队列内部的元素类 class QueueElement { constructor(element, priority) { this.element = element; this.priority
XPoet
2021/04/26
3240
在JavaScript中的数据结构(队列)
理所有的任务,它被称为事件循环。浏览器要负责多个任务,如渲染HTML,执行JavaScript代码,处理用户交互(用户输入、鼠标点击等),执行和处理异步请求。
肥晨
2023/06/27
5030
在JavaScript中的数据结构(队列)
【化解数据结构】详解队列,优先队列,循环队列,并实现一个队列
队列遵循先进先出的规则,也就是在尾部添加元素,从头部移除元素,最新添加的元素排在末尾
小丞同学
2021/11/22
3300
【化解数据结构】详解队列,优先队列,循环队列,并实现一个队列
《javascript数据结构和算法》读书笔记(2):队列
队列和栈非常相似。但是使用的是FIFO(First In First Out,先进先出)原则。在尾部添加元素,在顶部移除元素。
一粒小麦
2019/07/18
4370
《javascript数据结构和算法》读书笔记(2):队列
数据结构知否知否系列之 — 队列篇
队列,英文 First In First Out 简称 FIFO,遵从先进先出的原则,与 “栈” 相反,在队列的尾部添加元素,在队列的头部删除元素,如果队列中没有元素就称为空队列。
五月君
2019/08/27
5010
【算法】214-每周一练 之 数据结构与算法(Queue)
这些都是数据结构与算法,一部分方法是团队其他成员实现的,一部分我自己做的,有什么其他实现方法或错误,欢迎各位大佬指点,感谢。
pingan8787
2019/07/25
2860
JS数据结构与算法 — 栈与队列
栈与队列分别是两种数据结构,不同语言对于栈和队列有着不同的声明 栈数据结构的特点是 FILO(first in last out) 即先进后出,队列则是 FIFO(first in first out)即先进先出。 1. 数据结构【栈】介绍
用户9914333
2022/07/21
5140
JS数据结构与算法 — 栈与队列
《JavaScript数据结构与算法》读书笔记
这本书让我回顾了一遍大学时候学的数据结构。数据结构和算法是程序员最喜欢也是最痛苦的部分,这本书很轻松的描述了这部分东西,是一本很不错的书。这篇文章记录书中的重点部分,并不会对书中所有的内容都复述一遍,如果希望了解更多的内容可以去看看这本书。由于ES5和ES6思想基本上是相同的,这里只记录ES6的实现。
kai666666
2020/10/19
4010
《JavaScript数据结构与算法》读书笔记
Javascript[0x03] -- 队列
生活中队列的例子有很多,例如吃饭排队、小学生出勤做广播体操、打印机打印文件、去地铁坐车也要排队,去海底捞吃饭也要叫号排队,这些都是队列的一种;还有一种就是优先队列,例如VIP,还有SVIP等等; 还有循环队列例如丢手绢、那种两个人玩左轮手枪看最后一颗子弹属于谁的游戏等。
江涛学编程
2020/06/19
4700
Javascript[0x03] -- 队列
常见数据结构和Javascript实现总结
做前端的同学不少都是自学成才或者半路出家,计算机基础的知识比较薄弱,尤其是数据结构和算法这块,所以今天整理了一下常见的数据结构和对应的Javascript的实现,希望能帮助大家完善这方面的知识体系。
MudOnTire
2019/08/09
5720
常见数据结构和Javascript实现总结
【数据结构】Javascript中你应该知道的栈
栈(stack)又名堆栈,是一种遵循后进先出(LIFO)原则的有序集合。新添加或待删除的元素都保存在栈的末尾,称作栈顶,另一端称作栈底。在栈里,新元素都靠近栈顶,旧元素都接近栈底。
coder_koala
2019/07/30
4030
【数据结构】Javascript中你应该知道的栈
JavaScript创建栈结构
在数据结构中栈是一种遵从后进先出(LIFO)原则的有序集合。新添加的或待删除的元素都保存在栈的末尾,称作栈顶,另一端就叫栈底。在栈里,新元素都靠近栈顶,旧元素都接近栈底。栈的形象描述可以比作一桶水、我们喝到的始终是最新倒进去的(假设水不存在混合的问题)。
OECOM
2020/07/02
9070
JavaScript创建栈结构
使用JavaScript创建队列结构
队列和栈是两种相似的结构,区别主要在于栈是先进后出,队列是先进先出(FIFO)。队列插入元素是在队尾插入,在队列头弹出,形象的描述为排队,先到的先办事,后到的后办事。在算法应用上可以应用在消息队列、的打印机队列等。
OECOM
2020/07/02
9560
使用JavaScript创建队列结构
Javascript[0x02] -- 栈
生活中栈的例子有很多,像子弹压膛然后发射、课代表把作业交给老师,总是最上面最迟交的那个人先挨批、搞计算机经常听到的内存堆栈溢出等等。
江涛学编程
2020/06/19
6290
Javascript[0x02] -- 栈
JS高级-数据结构的封装
最近在看了《数据结构与算法JavaScript描述》这本书,对大学里学的数据结构做了一次复习(其实差不多忘干净了,哈哈)。如果能将这些知识捡起来,融入到实际工作当中,估计编码水平将是一次质的飞跃。带着这个美好的愿望,开始学习吧O(∩_∩)O~~ 我们知道在JS中,常常用来组织数据的无非是数组和对象(这些基础就不介绍了)。但在数据结构中,还有一些抽象的数据类型:列表、栈、队列、链表、字典、散列、集合、二叉树、图等,可以用来更好的对实际场景建模。当然这些数据类型,原生JS不支持,那么就需要通过封装来模拟,其底层
小古哥
2018/03/08
8.1K0
相关推荐
JS数据结构与算法-队列
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验