一文让你快速了解JavaScript栈

 更新时间:2022年07月13日 14:22:57   作者:​ 一碗周​  
这篇文章主要介绍了一文让你快速了解JavaScript栈,栈全称为堆栈,是一种先进后出的的数据结构,栈中只有两种基本操作,也就是插入和删除,也就是入栈和出栈操作,栈只有一端可以进行入栈和出栈操作,我们将其称为栈顶,另一端称其为栈底

前言

前面两篇文章介绍了数据结构和算法的一些前置内容,这篇文章开始正式学习常见的数据结构,首先学习的就是(Stack)。

什么是栈?

栈全称为堆栈,是一种先进后出的的数据结构,栈中只有两种基本操作,也就是插入删除,也就是入栈和出栈操作栈只有一端可以进行入栈和出栈操作,我们将其称为栈顶,另一端称其为栈底;如下图展示了栈这个数据结构:

JavaScript中的栈

JavaScript并没有栈这个数据类型,但是可以通过数组进行模拟,而且数组中提供的push()pop()选项,正好实现先入后出的的操作,

示例代码如下:

const stack = []

// 入栈
stack.push(1)
stack.push(2)
// 出栈
const v1 = stack.pop() // 2
const v2 = stack.pop() // 1

栈的应用场景

栈是算法和程序中最常用的辅助结构,其的应用十分广泛,凡是需要先进后出场景都有栈的身影,比如:

  • 函数调用堆栈
  • 判断字符串括号是否有效

接下来我们依次来看:

函数调用堆栈

JavaScript中的函数调用堆栈就是一个应用栈的一个典型例子,比如下面这段代码:

function f1() {}
function f2() {
  f1()
}
function f3() {
  f2()
}
f3()

如下图:

执行过程如下:

  • 调用函数f3(),将f3压入堆栈;
  • f3()中调用了f2(),将f2压入堆栈;
  • f2()中又调用了f1(),将f1压入堆栈;
  • 只有f1()运行完成才能继续往下执行,所以f1()先出栈,以此类推。

有效的括号

有效的括号是力扣中的一个关于栈的算法题目,题目大意就是判断给定字符串中的括号是否匹配,匹配返回true,否则返回false

解题思路如下:

  • 判断字符串的长度是否为偶数,不为偶数直接返回false,因为括号都是成对出现的;
  • 新建一个栈;
  • 遍历字符串,遍历到每一项时如果时左括号,将其压入栈;如果是右括号,与栈顶对比,如果相匹配则出栈,不匹配则返回false

实现代码如下:

/**
 * @param {string} s
 * @return {boolean}
 */
var isValid = function(s) {
    if (s.length % 2 !== 0) return false
    const stack = []
    for(let i = 0; i<s.length; i++) {
        const c = s[i] // 记录当前项
        if (c === '(' || c === '[' || c==='{') {
            stack.push(c)
        } else {
            const t = stack[stack.length - 1] // 获取栈顶元素
            if (
                (t === '(' && c === ')') ||
                (t === '[' && c === ']') ||
                (t === '{' && c === '}')
            ) {
                stack.pop()
            } else {
                return false
            }
        }
    }
    // 如果为0表示全部匹配,有剩余则表示不匹配
    return stack.length === 0
};

肯有还有更优的写法,这里直接使用的暴力解法。

总结

到此这篇关于一文让你快速了解JavaScript栈的文章就介绍到这了,更多相关JS 栈内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • JS动态给对象添加属性和值的实现方法

    JS动态给对象添加属性和值的实现方法

    下面小编就为大家带来一篇JS动态给对象添加属性和值的实现方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-10-10
  • 一组JS创建和操作表格的函数集合

    一组JS创建和操作表格的函数集合

    在用AJAX的时候,经常要用JS操作DOM,当涉及到数据列表的时候,那用表格比较多,这里写了组函数集合,专门用来操作表格,当然,目前还有很多不足,但是对一些简单操作还是很方便的。
    2009-05-05
  • 原生JS+HTML5实现的可调节写字板功能示例

    原生JS+HTML5实现的可调节写字板功能示例

    这篇文章主要介绍了原生JS+HTML5实现的可调节写字板功能,涉及javascript结合HTML5属性动态操作页面元素实现绘图功能相关技巧,需要的朋友可以参考下
    2018-08-08
  • JS实现点星星消除小游戏

    JS实现点星星消除小游戏

    这篇文章主要为大家详细介绍了JS实现点星星消除小游戏,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-03-03
  • javascript的replace方法结合正则使用实例总结

    javascript的replace方法结合正则使用实例总结

    这篇文章主要介绍了javascript的replace方法结合正则使用技巧,实例总结了replace方法配合正则表达式进行变量、分组、字符等替换技巧,需要的朋友可以参考下
    2016-06-06
  • javascript拖拽上传类库DropzoneJS使用方法

    javascript拖拽上传类库DropzoneJS使用方法

    这篇文章主要介绍了javascript拖拽上传类库DropzoneJS使用方法,大家参考使用吧
    2013-12-12
  • HTML DOM Viewer

    HTML DOM Viewer

    HTML DOM Viewer...
    2006-09-09
  • 微信小程序实现Canvas画板源代码

    微信小程序实现Canvas画板源代码

    微信小程序中的画布是非常重要的展示控件,其相当于HTML中的canvas控件,下面这篇文章主要给大家介绍了关于微信小程序实现Canvas画板的相关资料,需要的朋友可以参考下
    2024-08-08
  • HTML与javascript常碰到的编码问题

    HTML与javascript常碰到的编码问题

    在日常的前端开发工作中,我们会经常的与HTML、javascript、css等语言打交道,和一门真正的语言一样,计算机语言也有它的字母表、语法、词法、编码方式等
    2008-12-12
  • js模仿java的Map集合详解

    js模仿java的Map集合详解

    这篇文章主要介绍了js模仿java的Map集合的相关资料,Java中某些最常用的集合类是List和Map,感兴趣的小伙伴们可以了解一下
    2016-01-01

最新评论