你所不知道的JSON.parse() 和 JSON.stringify() – 高级用法

你所不知道的 JSON.parse() 和 JSON.stringify() – 高级用法

JSON 是前端开发中经常使用的数据格式之一,而 JSON.parse() 和 JSON.stringify() 则是处理 JSON 数据的常用方法。本文将介绍这两个方法的高级用法,帮助您更好地理解和运用它们。

JSON.parse()

JSON.parse() 方法可以将一个 JSON 字符串解析为 JavaScript 对象。但除此之外,它还有以下几个高级用法:

1. 转换日期

如果 JSON 数据中包含了日期类型,那么在将它们转换为 JavaScript 对象时,日期类型将会变成字符串。为了保留原来的日期类型,可以通过传入一个 reviver 函数作为第二个参数来实现。

----- -------- - --------- -----------------------------
----- ------- - ----- ------ -- -
    -- ------------------------------------------------------------ -
        ------ --- ------------
    -
    ------ ------
--
----- ------- - -------------------- ---------
-------------------------- -- ------ --- -- ---- -------- -------- --------

2. 处理循环引用

在 JSON 数据中存在循环引用的情况下,直接使用 JSON.parse() 方法会抛出 TypeError 异常。但可以通过传入一个 reviver 函数作为第二个参数来处理循环引用。

----- -------- - ------ ----- ----- -------
----- ------- - -------------------- ----- ------ -- -
    -- ---- --- ---- -
        ------ ------------
    -
    ------ ------
---
--------------------- -- ---- -- - -- - -- ---------- - - -

3. 实现深拷贝

使用 JSON.parse() 方法进行深拷贝时需要注意,如果对象中包含了函数、正则表达式、Map 等非原始类型的数据,那么它们将无法被正确地序列化。因此,可以在实现深拷贝时先将这些非原始类型的数据转换成序列化后的 JSON 字符串,再调用 JSON.parse() 方法进行解析。

----- --------- - ----- -- -
    ----- --- - --------------------
    ------ ----------------
--

JSON.stringify()

JSON.stringify() 方法可以将 JavaScript 对象序列化为 JSON 字符串。但除此之外,它还有以下几个高级用法:

1. 过滤属性

在将 JavaScript 对象序列化为 JSON 字符串时,可以通过传入一个 replacer 函数作为第二个参数来过滤属性。replacer 函数可以是一个数组或一个函数,用于指定要序列化的属性。

----- --------- - -
    ----- -----
    ---- ---
    -------- -
        ----- -----
        ------- -----
    -
--
----- --------- - ------------------------- -------- ------------
----------------------- -- -------------------------------------------------------

2. 转换值

在将 JavaScript 对象序列化为 JSON 字符串时,可以通过传入一个 replacer 函数作为第二个参数来转换属性的值。replacer 函数可以是一个数组或一个函数,用于指定要序列化的属性及其转换方式。

----- ------------ - -
    ----- -----
    ---- ---
    ------ --- ------------------
--
----- ------------ - ---------------------------- ----- ------ -- -
    -- ---- --- -------- -
        ------ ----------------------------------------------- -

- ---------------------------------------------------------- --------
-------------------------------------------------------------------------------------