V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 985 天前的主题，其中的信息可能已经有所发展或是发生改变。

最近我调研了 He3 前端同学日常的开发工作，他们总结了 3 个开发过程经常遇到的问题：

JSON 格式化和校验的问题
正则表达式的编写和校验问题
获取剪切板历史记录的问题这 3 个问题非常具有代表性，我相信大部分人的解决办法是通过百度或 Google 搜索临时工具来解决，但这些工具质量参差不齐，长期可用性也较差。

接下来，我们将深入探讨上面 3 个见的问题以及工具，同时在文末邀请您对 He3 计划开发的剪切板工具提出建议。

JSON 格式化

在前端开发中，处理接口数据、存储数据和传输数据时，常常遇到无序的 JSON 字符串，这给开发和调试带来了很大的麻烦。为了解决这个问题，开发者可以使用 JSON 格式化工具将无序的 JSON 字符串快速转换为易读的格式，方便理解和处理数据。

JSON 是前后端数据交互中的常用数据格式。JSON 格式化操作可以帮助开发者更好地查看和理解 JSON 数据，提高开发效率和数据传输的准确性，JSON 格式化工具可以实现以下目标：

美化 JSON 数据：一般情况，从后端获取的数据是压缩后的 JSON 字符串，没有按照键值对的形式排列，难以直观地看出数据结构。格式化后的 JSON 数据更为易读，包含缩进层级，方便开发者快速定位数据结构。
校验 JSON 数据：JSON 格式化工具还可以帮助开发者校验 JSON 数据的合法性。当 JSON 数据格式不正确时，JSON 格式化工具会提示错误信息，方便开发者及时发现和纠正问题。
转换 JSON 数据：有时候，需要将 JSON 数据转换为其他格式，例如 CSV 、XML 等。

常见的 JSON 格式化工具包括 JSON Formatter 、JSONLint 、JSON Viewer 等，IDE 中常见的 JSON 格式化插件包括 VS Code 的 Prettier 和 ESLint 等，这些工具的免费版一般支持不超过 50 个记录、200 个节点、1000 个字符，其余功能需要付费解锁，部分不支持自定义参数。

1_1 上图是深受前端开发者喜爱的 JSON Formatter ，它在使用过程中无法解决 JSON 数据本身的错误，只能解决格式上的问题，而对于缺少引号或不规范的代码，JSON Formatter 表现欠佳。

而 He3 JSON Format 工具除了具备 JSON 错误提示以外，甚至还能够兼容 JSON 格式错误的情况。 1_2

此外，He3 还提供了近 40 款与 JSON 相关的工具包，涵盖了 JSON 转主流语言的结构体以及接口，例如:

JSON to Go Struct https://t.he3app.com?qdiv
JSON to Kotlin Class https://t.he3app.com?mt6g
JSON to JAVA Bean https://t.he3app.com?d5ik
JSON to Python Class https://t.he3app.com?cezo
JSON Merge https://t.he3app.com?mbvq

1_3 1_4

正则表达式

对于前端而言，正则表达式的应用场景有以下几个：

表单验证：在前端开发中，常常需要验证用户输入的表单数据，例如邮箱、手机号码、密码等。可以使用正则表达式来验证这些数据的格式是否正确。

文本搜索：在文本编辑器或代码编辑器中，可以使用正则表达式来进行文本搜索。例如，在代码中搜索所有包含某个特定字符串的代码块，或在日志文件中搜索某个时间段的日志记录等。

URL 路由：在 Web 应用程序中，URL 路由是一个重要的概念。可以使用正则表达式来定义 URL 路由规则，以实现 URL 路由功能。

编程语言中的字符串处理：在编程语言中，字符串处理是一个常见的任务。可以使用正则表达式来处理字符串，例如搜索、替换、匹配等。

RegExr 是一个不错的正则表达式工具，它支持实时匹配和可视化展示匹配结果，还有实用的正则表达式参考资料，深受前端开发者的喜爱。

但是正则表达式语法非常复杂，有很多不同的规则和语法结构，由于 RegExr 并不能支持所有的正则表达式语法，因此在某些情况下，测试结果可能会出现误差。

例如，如果使用 RegExr 进行一个包含捕获分组的复杂正则表达式的测试，如果其中包含某些特定的语法结构，可能会导致测试结果不准确。这可能会让开发者误以为自己的正则表达式是正确的，而在实际应用中出现错误。 2_1