关于javascript:使用JSONPath解析JSON数据

35次阅读

共计 1161 个字符，预计需要花费 3 分钟才能阅读完成。

本文由 Deguang 发表于码路 - 技术博客

在前端开发中，当接口返回一个简单的嵌套 JSON 时，获取其中某个固定层级的数据，须要应用 链式取值

// 接口数据
var obj = {
    name: "历史书",
    value: 3,
    children: [
        {
            name: "明清",
            value: "3-1",
            count: 10
        },
        {
            name: "近代",
            value: "3-2",
            count: 20
        }
    ]
}
// 获取第二个子类型的 value
const val = obj.children[1].value // 3-2

当层级构造再次变长，应用链式取值代码简短，且容易出错如，若这里的数据层级呈现问题，比方 children 长度仅为 1，就会遇到咱们常见的报错：Uncaught TypeError: Cannot read property 'value' of undefined。

为了防止报错导致问题，这里就能够应用 JSONPath 来进行取值。

在意识 JSONPath 前，先理解下 xPath。xPath 是XML的门路语言，应用门路标识符通过层级构造定位文档元素，例如在 HTML 中定位元素：

相似的，JSONPath 是通过门路检索 JSON，反对操作符、函数、过滤器等用法，不便疾速定位，下面的 value 获取，能够用 JSONPath 形容为JSONPath('$.children[1].value', obj)

符号	形容
$	查问的根节点对象，用于示意一个 ison 数据，能够是数组或对象
@	过滤器断言 (filter predicate) 解决的以后节点对象，相似于 iava 中的 this 字段
*	通配符，示意一个名字或数字
*	递归搜寻
.<name>	子节点
[‘<name>'(,'<name>’)	一个或多个子节点
<number> (, <number>)]	一个或多个数组下标
[start:end]	数组片段，区间为[start.end), 不蕴含 end
[?(<expression>)]	过滤器表达式，表达式后果必须是 boolean

函数能够在门路的尾部调用，函数的输入是门路表达式的输入

符号	形容	输入
min()	获取数值类型数组的最小值	Double
max()	获取数值类型数组的最大值	Double
avg()	获取数值类型数组的平均值	Double
stddev()	获取数值类型数组的标准差	Double
length()	获取数值类型数组的长度	Integer

过滤器是用于筛选数组的逻辑表达式。

操作符	形容
==	等于，但数字 1 不等于字符 1
!=	不等于
<	小于
<=	小于等于
>	大于
>=	大于等于
=~	判断是否合乎正则表达式，例如[?(@.value =~ foo.*?/i)]
in	所属符号，例如[?(@.size in [s，M)]
nin	排除
size	长度
empty	判空