JSON也可以像SQL一样查询，所有开发人员的福音

拥抱高效人生，科技改变生活。每个人都能拥有适合自己的高效管理工具。大家好，我是牧凡。

前言

做开发的小伙伴，对JSON肯定不会陌生。

JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，它基于文本，易于人阅读和编写，同时也易于机器解析和生成。应该说现如今的开发领域里，JSON的应用是最广泛的。

我们通常会在以下场景中需要对JSON进行处理：

调试APIs：

开发者在调试APIs时需要快速查看和修改JSON数据。

数据转换：

需要将JSON数据转换为其他格式，如XML或CSV。

教育和学习：

学生和教师在学习JSON和APIs时需要可视化工具来更好地理解数据结构。

配置管理：

需要查看和编辑复杂的JSON配置文件。

虽然程序开发中，我们有的是手段来对它进行解析、格式化、转义等。但是它现在的应用实在是过于广泛，有时候为了调试方便，就需要有一个可视化的工具，能够让我们方便快捷的对JSON字符串进行操作。

当然，提供这种功能多工具非常多。随便举几个例子，你肯定多多少少都用过。

好用的JSON可视化工具推荐

JSONView：

一个Chrome插件，可以在浏览器中格式化和验证JSON。

JSONLint：

一个在线工具，提供格式化、验证和压缩JSON数据。

Visual Studio Code：

一个强大的代码编辑器，内置JSON支持和格式化功能。

Postman：

一个API开发工具，支持JSON数据的可视化和操作。

JQ Playground：

一个在线工具，用于测试和学习JQ（一种处理JSON数据的命令行语言）。

Prettier：

一个代码格式化工具，支持多种语言，包括JSON。

JSON Formatter & Validator：

一个浏览器插件，提供JSON数据的格式化和验证。

DBeaver：

一个数据库管理工具，支持多种数据库，包括JSON的可视化和编辑。

网上，也有很多提供类似功能的在线工具

JSONLint

一个在线的JSON验证器和格式化工具，可以帮助你检查JSON数据的语法错误，并进行格式化。

网址：

Beautify Tools - JSON

提供JSON格式化和验证功能，同时还有一些其他代码美化工具。

网址：

JSON Formatter & Validator

一个功能全面的在线工具，可以格式化和验证JSON数据，同时提供高亮显示。

网址：

Convert JSON

除了格式化和验证，这个工具还提供了JSON与其他格式（如XML和YAML）之间的转换功能。

网址：

JSON to CSV Converter

一个将JSON数据转换为CSV文件的在线工具，适合需要将JSON数据导入表格的用户。

网址：

JSON Editor Online

一个功能强大的在线JSON编辑器，支持格式化、验证和高亮显示。

网址：

Code Beautify

提供JSON格式化和验证，同时还有其他多种编程语言的美化工具。

网址：

用过这些工具的大家肯定有会这样的共识：功能很好很强大，就是广告有点多。一不小心，就点到广告页面里，再也回不来了。

所以，以上的这些工具都不是我的首选。我自己现在最常用的JSON解析工具是自己搭建的，绝对没有广告，甚至还可以根据自己的喜欢进行功能优化。完全做到随心所欲。

自建的JSON解析工具

这个工具已经被集成到了我的工具箱中。访问地址是：https://www.skillup.com.cn/json

页面如下

页面中已经默认显示了一段JSON格式的数据。这是一段示例代码，告诉大家，JSON就是长这样子的。

功能介绍

数据自动去除转义

原本的功能中，是不支持自动转义的。但是这种小问题，对于有技术功底的我们来说，并不困难。

随便更改了几行代码，就实现了自动去除转义的效果了。

比如下面这个字符串，就是被转义之后的结果

{\"Array\":[1,2,3],\"Boolean\":true,\"Null\":null,\"Number\":123,\"Object\":{\"a\":\"b\",\"c\":\"d\"},\"String\":\"Hello World\"}

我们拿着这个字符串，到一些JSON编辑工具中，是会报错的。因为它并不是一个真正的JSON结构。但是在我们的工具箱中，就不需要有这个担心了。因为当我们给复制到文本框中之后，自动的就会被转换成JSON结果了。

数据美化和压缩

工具顶部，从左开始数，第一和第二个菜单，分别对应的就是【数据美化】和【数据压缩】了

点击【数据美化】按钮后，结果就会被格式化，页面中会根据JSON的层级自动加上缩进和换行效果，便于大家查看

‍

格式化的结果便于我们查阅，但是查阅过后，有时候也需要将其压缩，这样会节省空间。压缩其实是格式化的反向结果，点击之后，页面上的结果就会变回这样

数组排序

第三个菜单对应的操作是【数组排序】

顾名思义，是可以针对一个数组格式的JOSN字符串，根据对应的属性值进行排序。

比如这样的一段内容

{  "items": [    {      "name": "apple",      "value": 5    },    {      "name": "banana",      "value": 2    },    {      "name": "grape",      "value": 8    },    {      "name": "kiwi",      "value": 4    },    {      "name": "orange",      "value": 3    }  ]}

我们可以根据不同的字段，进行升序还是降序的排列。便于我们对结果进行数据查看。

复杂操作

第四个菜单对应的操作，名字是【变换】。

实际上，它是一个可以支持多维复杂操作的一个选项。

从操作向导中，可以看出。这个按钮是支持JMESPath的查询、排序或转化操作的。

我查了一下什么是JMESPath。它的定义如下

JMESPath 是一种用于查询和转换 JSON 数据的语言。它允许用户以一种简单而直观的方式提取和操作 JSON 数据，适用于各种编程语言和工具中。在 JMESPath 中，你可以使用路径表达式来访问 JSON 数据的各个部分，并对其进行过滤、排序、转换等操作。

下面，简单的介绍几个常用的命令，比如我们的JSON数据是：

{

   "fruits": [

       { "name": "apple", "value": 5 },

       { "name": "orange", "value": 3 },

       { "name": "banana", "value": 2 },

       { "name": "grape", "value": 8 },

       { "name": "kiwi", "value": 4 }

   ]

}

查询

查询所有水果的名称：

fruits[*].name

结果可以在预览框中查看

过滤

查询值大于4的水果

fruits[?value > 4]

结果如下

排序

在我的工作中，我其实对排序操作的需求是最为频繁的。以前都是在excel中操作，但是现在，我也可以在这个工具中进行了

虽然 JMESPath 本身不支持直接排序，但可以通过查询和表达式组合来实现。

比如按照value进行排序

fruits | sort_by(@, &value)

结果如下

转换

查询并转换为包含名称和相应值的字符串

fruits[*].join(`: `, [name, value])

结果如下

这个命令，是将fruits数组中的name和value对应的值，拼接到了以给字符串中了。

这里需要注意的是，这个命令只能对字符串类型的参数可用，比如这个例子中的value的值是数字，其实用这个命令就会报错，需要将value改成字符串，才会见到真正的结果。

JMESPath 提供了一种灵活且强大的方式来处理 JSON 数据。通过组合查询、过滤、排序和转换，你可以轻松地从复杂的 JSON 结构中提取所需的信息。你可以在许多编程语言中找到 JMESPath 的实现，例如 Python、JavaScript 等。

我们这里只介绍了几个常用的，简单的操作。如果你有其他的想法需要验证，也可以在这里进行尝试。

结语

可能是因为工作的原因，我是一个重度的JSON使用者。几乎无时无刻都在与JSON打交道。

以前，在浏览器里收藏了几个常用的JSON格式的化的工具。但是自从在自己的工具箱中，集成了这个工具之后，我的这些操作几乎全部都转移到工具箱中来进行了。

不管是简单的还是复杂的操作，这里基本都已经能够满足我了。

而且，我再也不需要记忆那么多复杂的网址，去登陆其他网站，并与不计其数的广告进行战斗了。

如果你也是一个JSON的重度使用者，你也想要一个干净整洁且功能全面的JSON工具，你也可以来我这里使用，也可以自己搭建一个同样的工具。

感谢您的观看，喜欢请关注，赞同请收藏。期待您的反馈，欢迎来交流。

‍