JSON.stringify() 的 5 个特性

jSON.stringify()

JSON.stringify() 方法能将一个 JavaScript 对象或值转换成一个 JSON 字符串。

第二个参数(数组)

JSOn.stringify 有第二个参数,不知道大家有没有用过,那么第二个参数作用是什么了?
例如要在控制台中打印对象的键数组。我们有一个对象 product 并且我们想知道 product 的 name 属性值。

    console.log(JSON.stringify(product));

它会输出下面的结果。

{"id":"01", name: "天启", code: "1234"}

如果数据太多在日志中很难找到 name 键,因为控制台上显示了很多没用的信息。当对象变大时,查找属性的难度增加。stringify 函数的第二个参数这时就有用了。让我们重写代码并查看结果。

    console.log(JSON.stringify(obj, ["name"]))
    // 结果
    // "{"name":"天启"}"

问题解决了,与打印整个 JSON 对象不同,我们可以在第二个参数中将所需的键作为数组传递,从而只打印所需的属性

第二个参数(函数)

我们还可以传入函数作为第二个参数。它根据函数中写入的逻辑来计算每个键值对。如果返回 undefined,则不会打印键值对。请参考示例以获得更好的理解。

const obj = {
    "name": "天启",
    "age": 999
}

JSON.stringify(obj,function (key, value) {
    if (typeof value === "string") {
        return undefined;
    }
    return value;
})

// 结果
// {"age": 26}

只有 age 被打印出来,因为函数判断 typeOf 为 String 的值返回 undefined。

第三个参数(数字)

第三个参数控制最后一个字符串的间距。如果参数是一个数字,则字符串化中的每个级别都将缩进这个数量的空格字符。

// 注意:为了达到理解的目的,使用 '--' 替代了空格
JSON.stringify(obj, null, 2)
//{
//--"name": "天启",
//--"age": 26,
//--"country": "India"
//}

第三个参数(字符串)

如果第三个参数是 string,那么将使用它来代替上面显示的空格字符。

JSON.stringify(obj, null,'**');
//{
//**"name": "天启",
//**"age": 26,
//**"country": "India"
//}
// 这里 * 取代了空格字符

toJSON 方法

我们有一个叫 toJSON 的方法,它可以作为任意对象的属性。JSON.stringify 返回这个函数的结果并对其进行序列化,而不是将整个对象转换为字符串。参考下面的例子。

const obj = {
    firstName : "天启",
    lastName : "坦克",
    age: 999,
    toJSON : function () {
        return {
            fullName: `${this.firstName} + ${this.lastName}`
        }
    }
}

console.log(JSON.stringify(obj));
// 结果
// "{"fullName": "天启坦克"}"

这里我们可以看到,它只打印 toJSON 函数的结果,而不是打印整个对象。

发表评论

您的电子邮箱地址不会被公开。