前言
transit-js 是一个用于序列化和反序列化 JavaScript 数据的 npm 包，它提供了一种比其他类似库更快、更紧凑的方式来处理数据。有了 transit-js，开发者可以轻松地将复杂的 JavaScript 数据类型转换成简单的形式，以便存储或传输数据。
在本文中，我们将深入学习 transit-js，并介绍如何使用它。文章对读者有指导意义，对想深入学习这个 npm 包的前端开发者十分有用。
安装
使用以下命令安装 transit-js：
npm install transit-js
基本用法
transit-js 可以处理多种类型的 JavaScript 数据。它提供了两个函数，用于将数据序列化成字符串，以供存储或传输，或将字符串反序列化成原始数据。
首先，让我们看一下将 JavaScript 数据序列化成字符串的示例。假设我们有以下 JavaScript 对象：
-- -------------------- ---- -------
----- ------ - -
----- --------
---- ---
-------- ----------- ------------
-------- -
----- ----------
--------- ---------
-
--要序列化它，我们可以使用下面的代码：
import Transit from 'transit-js'; const writer = Transit.writer(); const str = writer.write(person); console.log(str); // '"["~#cmap",["~#set",0,"name","Alice",1,"age",21,2,"hobbies","reading","swimming",3,"address",["~#cmap",[["~#set",0,"city","Beijing",1,"district","Haidian"]]]]]"'
可以看到，结果是一个字符串。我们可以使用这个字符串来存储数据或将其传递给其他系统。
要反序列化字符串并将其转换成原始数据，我们可以使用下面的代码：
import Transit from 'transit-js';
const reader = Transit.reader();
const obj = reader.read(str);
console.log(obj); // { name: 'Alice', age: 21, hobbies: [ 'reading', 'swimming' ], address: { city: 'Beijing', district: 'Haidian' } }这将把字符串转换回原始的 JavaScript 数据对象。
更高级的用法
transit-js 包含了一系列更高级的用法，例如处理日期、文件和循环引用等。在下面，我们将介绍一些这些用法。
处理日期
transit-js 能够处理 JavaScript 中的 Date 对象。如果我们有以下 JavaScript 对象：
const person = {
name: 'Alice',
birthday: new Date('1999-01-01')
};使用 transit-js 序列化它，我们将得到以下字符串：
'"["~#cmap",["~#set",0,"name","Alice",1,"birthday","~t1999-01-01T00:00:00.000Z"]]"'
与之前不同的是，日期被表示为~t前缀加上一个 ISO 8601 字符串。
反序列化时，它将返回如下格式的 Date 对象：
{
name: 'Alice',
birthday: Tue Jan 01 1999 08:00:00 GMT+0800 (China Standard Time)
}处理文件
transit-js 可以对文件进行序列化和反序列化。假设我们有以下 JavaScript 对象：
const file = new File(['Hello World!'], 'hello.txt', { type: 'text/plain' });
const obj = {
name: 'Alice',
file: file
};要序列化它，我们可以使用下面的代码：
import Transit from 'transit-js';
const writer = Transit.writer({ handlers: Transit.map([
[File, (file) => [':file', file.name, file.type]]
])});
const str = writer.write(obj);
console.log(str); // '"["~#cmap",["~#set",0,"name","Alice",1,"file",":file","hello.txt","text/plain"]]"'在上面的代码中，我们定义了一个名为 handlers 的选项，它包含一个函数，将 File 对象处理为一个数组。反序列化过程也很简单：
-- -------------------- ---- ------- ------ ------- ---- ------------- ----- ------ - ---------------- --------- ---------------------------- --------- --- -- -- -- --- --------------- --- --- ----- ----- --- - ----------------- ----------------- -- - -- ----- -------- -- ----- ------- ------ ------------ ------------- -------------- ----------------- --- --- -- ---- -------- -------- ------ -------- ------ ------------------- --- ----- --- ----- ------------- -- -
在反序列化过程中，我们定义了一个名为 readers 的选项，它包含一个处理程序，用于将名为“:file”的特殊标识符解析为一个 File 对象。
处理循环引用
transit-js 可以处理循环引用的 JavaScript 对象。如果我们有以下 JavaScript 对象：
const alice = { name: 'Alice' };
const bob = { name: 'Bob' };
alice.friend = bob;
bob.friend = alice;要序列化它，我们可以使用下面的代码：
-- -------------------- ---- -------
------ ------- ---- -------------
----- ------ - ---------------- --------- -------------
-------- ----- --- -- -
----- --- - ---------------------------
-- ---- -- ----- -
------------
-------
-
---------------------------
---------------------
----------------------------------------
--------------------------------------------
--
-----
----- --- - --------------------
----------------- -- ------------------------------------------------------------------------------------------------------------在上面的代码中，我们定义了一个名为 handlers 的选项，它包含了一个处理程序，可以处理循环引用的情况。在对象中，当遇到包含在其他对象中的对象时，它将引用其他对象的标识符。
反序列化的过程也很简单：
-- -------------------- ---- -------
------ ------- ---- -------------
----- ------ - ---------------- -------- ----------------------------
---------- ------ -- -
----- --- - ---
---------------------------
--- ---- - - -- - - ----- ---- -
----- --- - --------------
----- --- - --------------
-------- - ----
-
------ ----
--
-----
----- ------ - -----------------
-------------------- -- - ----- -------- ------- - ----- ------ ------- ---------- - -在反序列化过程中，我们定义了一个名为 readers 的选项，它包含一个特殊的处理程序，用于处理由 ~#cmap 标识的循环引用对象。
结论
本文整合了 transit-js 包的基本和高级用法。一般来说，使用 transit-js 序列化和反序列化 JavaScript 数据比使用其他库更快，更紧凑。了解这些用法，开发者可以更好地掌握 transit-js 的使用方法。
参考资料
- transit-js: https://github.com/cognitect/transit-js
- transit-format: https://github.com/cognitect/transit-format
- transit-js examples: https://github.com/cognitect-labs/transit-js/blob/master/examples/index.js
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedac96b5cbfe1ea0610a84