简单理解JavaScript数据结构的栈和列队

举报
青年码农 发表于 2022/08/24 23:01:42 2022/08/24
【摘要】 在了解JavaScript栈和列队之前,我们先了解下栈和列队的基本概念,栈和队列都是动态的集合,在栈中,栈实现了后进先出。在队列中,队列实现了先进先出的策略。一个简单的比喻,吃多了拉就是列队,吃多了吐就是栈。 上面总结的比较简短,我们结合代码来做进一步解释。 1 栈 我们先看一张图, 栈是一种LIF...

在了解JavaScript栈和列队之前,我们先了解下栈和列队的基本概念,栈和队列都是动态的集合,在栈中,栈实现了后进先出。在队列中,队列实现了先进先出的策略。一个简单的比喻,吃多了拉就是列队,吃多了吐就是栈。

上面总结的比较简短,我们结合代码来做进一步解释。

1 栈

我们先看一张图,

ac94c987c205988935db840bff9e1d71.png

栈是一种LIFO(Last-In-First-Out,后进先出)的数据结构,也就是最新添加的项最早被移除。而栈中项的插入(叫做推入)和移除(叫做弹出),只发生在一个位置,那就是栈的顶部。

最开始栈中不含有任何数据,叫做空栈,此时栈顶就是栈底。然后数据从栈顶进入,栈顶栈底分离,整个栈的当前容量变大。数据出栈时从栈顶弹出,栈顶下移,整个栈的当前容量变小。

a640f64771e335a16caebb53efdaf163.png

比如我们有一个书箱子,里面堆满了书。最下面的书,肯定是最早放进去的,如果你想拿最下面的书,你只能从上面一本一本拿出来,这就是栈。

JavaScript数组提供了内置方法,可以实现类似出栈入栈的功能,入栈push()、 出栈pop();

创建list

let arr = []

入栈

arr.push(1, 2, 3, 4)

出栈

arr.pop()

c37180398cd365bae7b452f1f4f7d78c.png

封装方法,实现栈结构

function Stack (){
    let 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())
    }
}

ES6方式实现

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

2 列队

我们还是先看一张图,

7554a8a71344a5c303fbda6dc47c16b0.png

队列是一种FIFO(Fist-In-First-Out,先进先出)的数据结构,队列在列表的末端添加项,从列表的前端移除项。就好像排队买票,取餐,先来的,最先买票,取餐。

JavaScript数组提供了内置方法,可以实现列队的功能,入队unshift()、 出队pop();

创建list

let arr = []

入队

arr.unshift(1)

出队

arr.pop()

384b4df2c9a1e9b6ca8f52d776f320ad.png

封装方法,实现列队结构

function Queue () {
    let items = []

    this.unshift = function (element) {
        items.unshift(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())
    }
}

ES6方式实现

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

文章来源: blog.csdn.net,作者:NMGWAP,版权归原作者所有,如需转载,请联系作者。

原文链接:blog.csdn.net/NMGWAP/article/details/125066799

【版权声明】本文为华为云社区用户转载文章,如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。