专栏名称: 前端从进阶到入院
我是 ssh,只想用最简单的方式把原理讲明白。wx:sshsunlight,分享前端的前沿趋势和一些有趣的事情。
目录
相关文章推荐
湖南日报  ·  “娃哈哈”商标转让了?宗馥莉任新职 ·  9 小时前  
湖南日报  ·  大风、雨雪马上来了!湖南天气接下来大反转 ·  12 小时前  
上海证券报  ·  福建金融“成绩单”,出炉 ·  12 小时前  
上海证券报  ·  巨头突然涨停 ·  昨天  
上海证券报  ·  吴清发声! ·  3 天前  
51好读  ›  专栏  ›  前端从进阶到入院

竟然还能这样高效地操作 JSON 对象!

前端从进阶到入院  · 公众号  ·  · 2024-05-13 00:24

正文

什么是 JSON Pointer

JSON Pointer [1] 是一种用于定位 JSON(JavaScript Object Notation)文档中特定值的简单而强大的方法。它通过使用斜杠 / 分隔符来指示 JSON 对象的层级结构,以确切地标识所需值的位置。

为什么使用 JSON Pointer

当处理大型或复杂的 JSON 数据结构时,定位特定值可能会变得非常麻烦。 使用 JSON Pointer 可以让你以一种简单而准确的方式指定所需值的位置,而不需要编写复杂的代码来遍历整个 JSON 结构。 这极大地简化了 JSON 数据的定位和操作过程。

此外,JSON Pointer 还具有以下优点:

  • 通用性:JSON Pointer 是一种通用的标准,因此可以在各种编程语言和平台上使用。这种通用性使得 JSON Pointer 成为跨平台开发和数据交换的理想选择。
  • 效率:由于 JSON Pointer 可以直接定位到所需值,因此它在处理大型 JSON 数据时效率很高。相比于传统的逐层遍历搜索方式,JSON Pointer 能够更快速地找到目标值。
  • 简单易懂:JSON Pointer 使用类似文件路径的语法,因此非常直观和易于理解。它的语法简洁清晰,使得使用者可以轻松地理解和使用它。
  • 精确定位:JSON Pointer 允许你以非常准确的方式指定 JSON 对象中的值,而无需关心其周围的结构。这意味着你可以专注于所需值的确切位置,而不必担心其他内容。

如何使用 JSON Pointer

很多常见的开发语言,都实现了 JSON Pointer 规范。在 Node.js 环境,我们可以使用 jsonpointer [2] 这个库。

首先,使用 npm 或 pnpm 来安装 jsonpointer

npm install jsonpointer
or 
pnpm add jsonpointer

成功安装 jsonpointer 库之后,我们就可以利用它提供的 API 来快速的定位和操作 JSON 对象。

1.获取指定路径的属性值

JSON Pointer 使用斜杠 / 分隔符来指示 JSON 对象的层级结构,如果指定的路径不存在,则会返回 undefined

const jsonpointer = require("jsonpointer");
let obj = {
  foo1,
  bar: { baz2 },
  qux: [345],
  zoo: {
    e: [{ a3 }, { b4 }, { c5 }],
  },
};

jsonpointer.get(obj, "/foo"); // returns 1
jsonpointer.get(obj, "/bar/baz"); // returns 2

jsonpointer.get(obj, "/quo"); // returns undefined

2.获取数组对象指定位置的值

若要访问指定位置的数组元素,则需要在 / 分隔符后面添加该元素的索引。

jsonpointer.get(obj, "/qux/0"); // returns 3
jsonpointer.get(obj, "/qux/1"); // returns 4
jsonpointer.get(obj, "/qux/2"); // returns 5

如果数组元素也是对象的话,我们只需按照属性的层级结构进行访问路径即可。

jsonpointer.get(obj, "/zoo/e/0/a"); // returns 3
jsonpointer.get(obj, "/zoo/e/1/b"); // returns 4
jsonpointer.get(obj, "/zoo/e/2/c"); // returns 5

除了,获取 JSON 对象的值之外,通过使用 jsonpointer 这个库提供的 set 方法,我们也可以设置指定路径的值。

3.设置指定路径的属性值

JSON Pointer 提供了一种往数组中插入新元素的便捷语法,即在 / 路径后添加 - 符号:

// sets obj.foo = 6;
jsonpointer.set(obj, "/foo"6); 
// sets obj.qux = [3, 4, 5, 6]
jsonpointer.set(obj, "/qux/-"6); 

// set zoo.e = [{"a":3},{"b":4},{"c":5},{"d":6}]
jsonpointer.set(obj, "/zoo/e/-", { d6 }); 

除了上面介绍的 set get 方法之外, jsonpointer 这个库还提供了一个 compile 方法,该方法会返回一个新的 JSON Pointer 对象,让我们更方便地访问 JSON 对象特定路径的属性。

const pointer = jsonpointer.compile("/foo");
pointer.get(obj); // returns 6
pointer.set(obj, 1); // sets obj.foo = 1

JSON Pointer 在 LangchainJS 中的应用

在 LangchainJS 的 JSONLoader [3] 中,也用到了 jsonpointer 这个库。使用该库的主要目的是为了能快速从 JSON 对象中,提取用户想要的数据。

使用示例

example.json

{
  "1": {
    "body""BD 2023 SUMMER",
    "from""LinkedIn Job",
    "labels": ["IMPORTANT""CATEGORY_UPDATES""INBOX"]
  },
  "2": {
    "body""Intern, Treasury and other roles are available",
    "from""LinkedIn Job2",
    "labels": ["IMPORTANT"],
    "other": {
      "name""plop",
      "surname""bob"
    }
  }
}

JSONLoader

export






请到「今天看啥」查看全文


推荐文章
湖南日报  ·  “娃哈哈”商标转让了?宗馥莉任新职
9 小时前
上海证券报  ·  福建金融“成绩单”,出炉
12 小时前
上海证券报  ·  巨头突然涨停
昨天
上海证券报  ·  吴清发声!
3 天前
热门视频集汇  ·  微 笑 (送给朋友圈)
7 年前
美食家常菜谱做法  ·  比黄焖鸡还好吃的鸡块做法,你不试试吗?
7 年前