JavaScript 实现嵌套括号内容提取的专业教程

javascript 实现嵌套括号内容提取的专业教程

本文旨在提供一种使用 JavaScript 处理嵌套括号结构的通用解决方案,该方案不依赖正则表达式,而是通过构建括号树来实现对括号内特定部分内容的提取。这种方法可以有效处理括号不平衡的情况,并提供灵活的遍历和过滤机制,适用于需要处理复杂嵌套结构的场景。

括号树的构建

核心思想是将输入的字符串解析成一棵树,树的每个节点代表一个括号对及其内部的内容。以下是实现这一过程的 BracketTree 类的代码:

class BracketTree {    constructor (brackets, string) {        if (typeof brackets != 'string' || brackets.length != 2 || brackets[0] == brackets[1]) {            return null;        }        let opening = brackets[0];        let closing = brackets[1];        function parse (start) {            let children = [];            let pos = start;            loop: while (pos < string.length) {                switch (string[pos]) {                case opening:                    let child = parse(pos + 1);                    children.push(child);                    if (child.end == string.length) {                        break loop;                    }                    pos = child.end;                    break;                case closing:                    if (start == 0) {                        children = [{                            children, start, end: pos, opened: false, closed: true,                            contents: string.slice(0, pos)                        }];                    }                    else {                        return {                            children, start, end: pos, opened: true, closed: true,                            contents: string.slice(start, pos)                        };                    }                }                pos++;            }            return (start == 0)? {                children, start, end: string.length, opened: false, closed: false,                contents: string            }: {                children, start, end: string.length, opened: true, closed: false,                contents: string.slice(start)            };        }        this.root = parse(0);    }}

这段代码定义了一个 BracketTree 类,其构造函数接收两个参数:brackets (一个包含开始和结束括号的字符串,例如 “{}”) 和 string (需要解析的字符串)。parse 函数递归地遍历字符串,当遇到开始括号时,创建一个新的子节点并递归调用 parse 函数。当遇到结束括号时,返回当前节点的信息。

树的遍历

为了提取括号内的内容,我们需要遍历构建好的括号树。BracketTree 类提供了一个 traverse 方法,它接受一个回调函数作为参数,并在遍历树的每个节点时调用该回调函数。

立即学习“Java免费学习笔记(深入)”;

    traverse (callback) {        if (typeof callback != 'function') {            return false;        }        let root = this.root;        let input = root.contents;        let nodeId = 0;        function recurse (parent, level) {            function callbackLeaf (start, end) {                callback({                    root, parent, level,                    nodeId: nodeId++, childId: childId++,                    start, end, contents: input.slice(start, end)                });            }            function callbackBranch (branch) {                return callback({                    root, parent, branch, level,                    nodeId: nodeId++, childId: childId++                });            }            let children = parent.children;            let childId = 0;            if (children.length == 0) {                callbackLeaf(parent.start, parent.end);                return;            }            callbackLeaf(parent.start, children[0].start - children[0].opened);            if (callbackBranch(children[0])) {                recurse(children[0], level+1);            }            for (var i = 0; i < children.length-1; i++) {                callbackLeaf(children[i].end + children[i].closed, children[i+1].start - children[i+1].opened);                if (callbackBranch(children[i+1])) {                    recurse(children[i+1], level+1);                }            }            callbackLeaf(children[i].end + children[i].closed, parent.end);        }        recurse(root, 0);        return true;    }

traverse 方法使用递归的方式遍历树,并在每个节点上调用回调函数。回调函数接收一个包含节点信息的对象,例如节点的层级、父节点、子节点等。

示例与应用

以下是一个使用 BracketTree 类提取括号内内容的示例:

let input = 'NOT OPENED {3}2}1}***{avatarurl {id {message}}} blah blah blah {1{2{3} NOT CLOSED';let tree = new BracketTree('{}', input);function filteredTraverse (caption, leafFilter, branchFilter) {    console.log(`${'-'.repeat(29 - caption.length/2)} ${caption} `.padEnd(60, '-'));    leafFilter ??= () => true;    branchFilter ??= () => true;    tree.traverse((args) => {        if (args.branch) {            return branchFilter(args);        }        if (leafFilter(args)) {            console.log(`${'  '.repeat(args.level)}`);        }    });}filteredTraverse(    'Ignore unbalanced and all their descendants',    null,    ({branch}) => branch.opened && branch.closed);filteredTraverse(    'Ignore unbalanced but include their descendants',    ({parent}) => parent.opened == parent.closed);filteredTraverse(    'Ignore empty',    ({start, end}) => start != end);filteredTraverse(    'Show non-empty first children only',    ({childId, start, end}) => childId == 0 && start != end);

这段代码首先创建一个 BracketTree 对象,然后定义了一个 filteredTraverse 函数,该函数接受一个标题和两个过滤器函数作为参数。filteredTraverse 函数使用 traverse 方法遍历树,并根据过滤器函数来决定是否打印节点的内容。

这个示例展示了如何使用 BracketTree 类来处理包含嵌套括号的字符串,并提取特定的内容。通过自定义过滤器函数,可以灵活地控制提取的内容。

注意事项与总结

性能考量: 对于非常大的字符串,递归的 parse 函数可能会导致性能问题。可以考虑使用迭代的方式来优化性能。错误处理: 可以添加更完善的错误处理机制,例如当括号不匹配时抛出异常。灵活性: BracketTree 类可以很容易地扩展以支持不同的括号类型。

总而言之,使用括号树是一种处理嵌套括号结构的强大方法。它比正则表达式更灵活,并且可以处理括号不平衡的情况。通过自定义遍历和过滤机制,可以轻松地提取括号内的特定内容。这种方法适用于需要处理复杂嵌套结构的各种场景,例如代码解析、数据提取等。

以上就是JavaScript 实现嵌套括号内容提取的专业教程的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1517121.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2025年12月20日 10:32:03
下一篇 2025年12月20日 10:32:20

相关推荐

  • 如何利用Intersection Observer API实现高性能的无限滚动?

    使用 Intersection Observer API 实现无限滚动,通过监听哨兵元素进入视口触发分页加载,避免频繁 scroll 事件性能问题。创建观察器监听末尾占位元素,当其可见时请求数据并插入内容。需设置 isFetching 状态锁防止重复请求,并在组件卸载时调用 disconnect()…

    2025年12月20日
    000
  • 如何在JavaScript中高效重命名并转换大型对象属性

    本文介绍如何在JavaScript中高效地对大型对象进行属性重命名和类型转换。通过结合使用解构赋值和展开运算符,可以简洁明了地将原始对象的特定属性重命名、应用函数进行类型转换,同时保留其他未修改的属性,从而生成符合新数据模型要求的新对象。 在处理包含大量字段的javascript对象时,我们经常需要…

    2025年12月20日
    000
  • React useEffect 登录后数据不同步问题:原理与解决方案

    本文深入探讨了React useEffect钩子在用户登录后,个人资料数据未能即时更新,需要页面刷新才能生效的常见问题。文章分析了useEffect依赖项的正确使用方式,指出了将自身状态作为依赖项的常见误区,并提供了基于用户认证状态(如用户ID或对象)来触发数据更新的专业解决方案,旨在帮助开发者实现…

    2025年12月20日
    000
  • 怎样设计一个抗压的 JavaScript 微服务间通信方案?

    采用异步消息队列解耦服务,通过重试与熔断提升容错,结合限流防止过载,并利用监控告警实现可观测性,构建高抗压通信体系。 微服务架构中,JavaScript 服务间的通信必须面对网络延迟、服务宕机、消息丢失等压力场景。设计一个抗压的通信方案,核心在于解耦、异步、重试、限流与可观测性。以下是关键设计思路。…

    2025年12月20日
    000
  • 如何实现一个JavaScript的无限滚动(Infinite Scroll)组件?

    答案:实现JavaScript无限滚动需监听滚动事件,判断接近底部时加载数据,通过isLoading防止重复请求,使用节流优化性能,并动态插入内容到DOM提升体验。 实现一个 JavaScript 的无限滚动组件,核心思路是监听用户滚动行为,在接近页面底部时自动加载更多内容。关键在于判断何时触发加载…

    2025年12月20日
    000
  • ApexCharts 时间序列图颜色对齐问题及解决方案

    在使用 ApexCharts 创建带有渐变填充的时间序列图时,当X轴为 datetime 类型且存在多个标签时,可能会出现颜色对齐错位的问题。本文将深入探讨此问题的原因,并提供两种有效的解决方案,确保颜色与数据正确对应,提升图表的可读性和准确性。 问题分析 当X轴类型设置为 datetime 时,A…

    2025年12月20日
    000
  • ApexCharts:解决时间序列图梯度填充颜色错位问题

    本文针对ApexCharts中时间序列图(axistype: datetime)应用梯度填充时,可能出现的颜色错位问题,提供了两种解决方案。核心在于理解梯度填充的原理,并根据时间戳或垂直梯度进行正确配置。通过示例代码,帮助开发者在时间序列图中实现精确的颜色映射,提升数据可视化效果。 在ApexCha…

    2025年12月20日
    000
  • ApexCharts:解决 datetime 类型 X 轴下渐变填充颜色错位问题

    在 ApexCharts 中,如果X轴类型设置为 datetime,并且使用了渐变填充,当X轴标签数量较多时,可能会出现颜色与数据对不上的问题。这是因为默认情况下,渐变是根据数据点的索引进行插值的,而不是根据X轴的实际时间距离。本教程将介绍两种方法来解决这个问题,确保颜色在 datetime 类型的…

    2025年12月20日
    000
  • 解决 ApexCharts 中日期时间轴渐变填充颜色错位问题

    本文介绍了两种解决 ApexCharts 中日期时间轴渐变填充颜色错位问题的方法。第一种方法通过计算每个数据点的时间戳,并基于时间戳的相对位置进行颜色插值,确保颜色与数据在时间轴上正确对齐。第二种方法利用垂直渐变,通过设置Y轴的最大值,并基于Y轴的比例关系定义颜色停止点,从而实现颜色与数据的对应。两…

    2025年12月20日
    000
  • 如何运用策略模式优化复杂的条件判断逻辑?

    策略模式通过将变化的行为封装为统一接口的不同实现,解耦条件判断与具体逻辑。当代码中存在多个if-else或switch-case根据类型选择行为时(如不同支付方式),可定义PaymentStrategy接口,由WeChatPay、AliPay等类实现各自支付逻辑。通过PaymentContext上下…

    2025年12月20日
    000
  • 在Mongoose中实现好友关系:更新User Schema中的好友数组

    本文旨在指导开发者如何在Mongoose中实现用户添加好友的功能,重点讲解在接受好友请求后如何正确更新User Schema中的好友数组。同时,文章也会探讨更高效的数据结构设计方案,以及在使用事务时需要注意的关键点,确保数据一致性。 安全地处理好友请求 首先,确保在处理好友请求时,发送者ID来自已验…

    2025年12月20日
    000
  • 在 Mongoose 中实现用户添加好友功能:最佳实践指南

    本文旨在指导开发者如何在 Mongoose 中实现用户添加好友的功能,重点讨论了如何处理好友请求、更新用户的好友列表,以及避免潜在的数据一致性问题。文章将探讨使用 FriendRequest 模型来管理好友关系,并分析直接在 User 模型中维护好友列表的优缺点,同时提供相应的代码示例和注意事项。 …

    2025年12月20日
    000
  • 如何在用户模式中向好友数组添加用户

    本文旨在指导开发者如何在用户接受好友请求后,将其信息添加到对方用户模式的 friends 数组中。文章将讨论避免前端篡改用户ID的措施,并通过 FriendRequest 模型查询好友列表,同时也会介绍如何在接受好友请求时更新用户模式,并强调使用事务以保证数据一致性的重要性。 确保用户ID的安全性 …

    2025年12月20日
    000
  • 在 Mongoose 中实现用户添加好友功能

    本文旨在指导开发者如何在 Mongoose 中实现用户添加好友的功能,并探讨了维护用户好友关系的不同策略。重点介绍如何安全地处理好友请求,以及在用户接受好友请求后,如何正确更新用户模式中的好友数组。同时,也讨论了使用额外数组存储好友关系的必要性,并提出了更优的查询方案。 安全地处理好友请求 在处理好…

    2025年12月20日
    000
  • JavaScript中防止函数推入数组时立即执行

    本文旨在解决JavaScript中将函数推入数组时函数立即执行的问题。通过将函数包装成匿名函数,可以延迟函数的执行,直到使用Promise.all()等方法需要执行它们时才真正调用。本文将提供详细的示例代码,演示如何避免函数立即执行,并确保它们仅在需要时才被调用。 在JavaScript中,当我们将…

    2025年12月20日
    000
  • 使用 Shiny 和 Sortable 创建可滚动 Bucket List

    本文将指导你如何使用 Shiny 和 Sortable.js 库创建一个具有固定高度和滚动条的 bucket list。通过添加 CSS 样式来限制容器高度,并设置 overflow 属性,即可实现当列表项过多时,在容器右侧显示滚动条的效果。 实现可滚动 Bucket List 的步骤 以下步骤将详…

    2025年12月20日
    000
  • 使用 Mongoose 更新用户的好友列表:最佳实践指南

    本文旨在指导开发者如何在使用 Mongoose 构建社交应用时,正确地更新用户的好友列表。文章将探讨如何安全有效地处理好友请求的接受流程,并讨论维护用户好友列表的不同策略,包括直接在 User Schema 中维护以及通过查询 FriendRequest Schema 间接获取。同时,本文将强调数据…

    2025年12月20日
    000
  • 解决 ApexCharts 中日期时间轴梯度填充颜色错位问题

    本文针对 ApexCharts 中在使用 axistype-datetime 的日期时间轴并应用梯度填充时,颜色错位的问题提供了两种解决方案。第一种方案通过计算每个数据点对应的时间戳来精确控制梯度颜色;第二种方案则利用垂直梯度,并根据Y轴的最大值来定义颜色分界点,从而实现颜色的正确对齐。通过本文的学…

    2025年12月20日
    000
  • JavaScript中的函数式反应编程(FRP)库(如RxJS)核心概念是什么?

    RxJS通过Observable实现数据流管理,核心包括可观察对象、观察者、操作符和Subject,利用函数式编程处理异步事件流,需注意资源释放以避免内存泄漏。 函数式反应编程(FRP)在JavaScript中通过库如RxJS实现,其核心是将随时间变化的数据流抽象为可观察的序列,并利用函数式编程的思…

    2025年12月20日
    000
  • 在 Shiny 中创建可滚动 Sortable 列表的教程

    本教程旨在解决 Shiny 应用中 sortable 包生成的列表内容过长时,如何使其容器固定高度并实现内部滚动的问题。通过引入自定义 CSS 样式,我们将详细演示如何为 rank_list 元素设置最大高度和溢出行为,从而在不影响拖拽功能的前提下,优化长列表的用户界面和体验。 1. 引言 在 R …

    2025年12月20日
    000

发表回复

登录后才能评论
关注微信