JavaScript代码优化:高效解析缩进式路径
本文介绍一种优化方案,用于高效解析包含缩进空格的路径字符串,并构建其层级结构。原始代码虽然功能正确,但效率较低且不够简洁。本优化方案采用更直接、更清晰的方法,提升代码的可读性和可维护性。
原始代码使用indexOf(str.trim())
计算空格数,效率低下。优化方案则通过更简洁的计算方法,直接获取每一行的缩进级别。
首先,代码将输入字符串按行分割,并使用map
函数处理每一行,计算每一行的缩进级别(空格数除以4向下取整)和有效值(去除首尾空格后的字符串):
const lines = str.split("n").map(line => ({ level: ~~((line.length - line.trimStart().length) / 4), value: line.trim() }));
原始代码在处理不规则缩进时存在问题。优化方案使用reduce
函数修正此问题:如果当前行的层级与上一行层级差大于1,则将当前行层级调整为上一行层级加1,确保层级关系的正确性:
lines.reduce((level, it) => { if (it.level - level > 1) { it.level = level + 1; } return it.level; }, 0);
接下来,代码使用path
数组存储当前路径,循环遍历lines
数组,根据每一行的层级更新path
数组,最终生成完整的路径列表result
。 这部分代码利用path
数组和slice
方法,避免复杂的条件判断,使代码更简洁易懂:
const path = []; const result = []; for (const it of lines) { const { level, value } = it; path[level] = value; result.push(path.slice(0, level + 1).join("/")); }
优化后的代码通过更直接、更清晰的方式计算缩进级别,有效处理不规则缩进,输出结果与原始代码一致,同时显著提升了代码的可读性和可维护性。
Ant Design Popover组件:如何用JavaScript模拟鼠标悬停事件来显示弹出内容?
开发人员如何快速稳定地访问GitHub?
在 TypeScript 中,实现类似 JavaScript 中 export * as 的导出和使用方式需要使用一些不同的语法,因为 TypeScript 目前还不直接支持 export * as。不过,我们可以通过以下方法来达到类似的效果。导出方式假设你有一个模块 moduleA.ts,其中包含多个导出:// moduleA.ts export const foo = 'foo'; export const bar = 'bar';你可以创建一个新的文件 index.ts,用于聚合这些导出:// in
打字稿实用程序类型每个React开发人员都应该知道
LiveScript 的演变:JavaScript 的前身
TypeScript:学习基础知识 + React