一文让你快速了解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中Iframe之间传值的方法
在js中，我们时常用到用iframe做系统框架，在子页面也，父页面之间的值传递是一个问题，下面是js获取父窗体和子窗体的对象js：
2013-03-03
js获取指定字符前/后的字符串简单实例
下面小编就为大家带来一篇js获取指定字符前/后的字符串简单实例。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2016-10-10
在HTML中嵌入JS代码的3种方式总结
现在的前端JavaScript可以说是异常火爆,即使并不准备向前端发展,但是对前端的一些基础知识还是必须有所了解的,先这篇文章主要给大家介绍了关于在HTML中嵌入JS代码的3种方式,需要的朋友可以参考下
2022-11-11
[JS源码]超长文章自动分页（客户端版）
[JS源码]超长文章自动分页（客户端版）...
2007-01-01
js中substring使用示例详解
substring是从中截取一段字符串,在组成一个新的字符串,这篇文章主要介绍了js中substring使用示例小结,本文通过示例代码给大家介绍的非常详细,需要的朋友可以参考下
2024-01-01
详解微信小程序-扫一扫 wx.scanCode() 扫码大变身
这篇文章主要介绍了微信小程序-扫一扫wx.scanCode() 扫码大变身，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2019-04-04
如何在微信小程序中使用less详解(最优方式)
这篇文章主要给大家介绍了关于如何在微信小程序中使用less(最优方式)的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2021-03-03
JavaScript中子对象访问父对象的方式详解
js中虽然没有传统面向对象的编程语言里子类访问父类的特殊语法，但是我们可以根据需要造一个，接下来本文给大家分享在JavaScript中子对象访问父对象的方式,需要的朋友可以参考下
2016-09-09
js输出数据精确到小数点后n位代码
要保留小数点后N位的问题，经过一番思索，终于解决了，这篇文章主要介绍了js输出数据精确到小数点后n位代码，感兴趣的朋友可以参考一下
2016-07-07
javascript实现在网页中运行本地程序的方法
这篇文章主要介绍了javascript实现在网页中运行本地程序的方法,实例分析了JavaScript基于ActiveXObject运行本地程序的技巧,需要的朋友可以参考下
2016-02-02