当前位置：网站首页 > 技术分类 > 正文

JSON.stringify()的使用 json.stringfly

ztj100 2024-12-24 17:01 9 浏览 0 评论

前言

作为一名前端开发者(本人业余前端[憨笑]，前些年搞过一段时间的全栈)，你可能熟悉JSON.stringify()方法，通常用于调试。但是很多只是简单使用一下接下来，让我们深入了解其实用性。

考虑一个对象如果想把她转成字符串打印出来：

const obj = {

age: 18

};

console.log(obj.toString()); // Result: [object Object]

如果你想这样打印你所看到的只能是 [object Object]

我们可以借助JSON.stringify()方法

const obj = {

age: 18

};

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

// Result: {"name":"San Shang You Ya","age":18}

大多数开发者直接使用 JSON.stringify()，但我即将揭示一些隐藏的技巧。

第二个参数(Array)

JSON.stringify() 接受第二个参数，它是一个你想在控制台中显示的对象的键的数组。例如：

const obj = {

age: 18

};

console.log(JSON.stringify(obj, ['name']));

// Result: {"name": "San Shang You Ya"}

这样而不是将整个 JSON 对象混乱地显示在控制台中，可以通过将所需的键作为数组传递给第二个参数来选择性地打印。

第二个参数(Function)

第二个参数也可以是一个函数，根据函数内的逻辑输出键值对。
如果返回 undefined，则该键值对将不会被打印出来。

const obj = {

age: 18

};

console.log(JSON.stringify(obj, (key, value) => (key === "age" ? value : undefined)));

// Result: {"age": 18}

第三个参数作为数字

第三个参数控制最终字符串中的间距。如果是一个数字，字符串化的每个级别将相应缩进。

const obj = {

age: 18

};

console.log(JSON.stringify(obj, null, 2));

第三个参数作为字符串

如果第三个参数是一个字符串，它将替换为空格字符

toJSON 方法

对象可以拥有一个 toJSON 方法。 JSON.stringify() 返回该方法的结果，并对其进行字符串化，而不是转换整个对象。

const superhero= {

firstName: "San Shang",

lastName: "You Ya",

age: 21,

toJSON() {

return {

fullName: `${this.firstName} + ${this.lastName}`

};

}

};

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

// Result: "{ "fullName" : "San Shang You Ya"}"

string转jsonobject

上一篇：100个Java工具类之12:JSON、JSON字符串和对象三者互转
下一篇：如何轻松实现 Python 中 JSON 数据的转换?

JSON.stringify()的使用 json.stringfly

前言

第二个参数(Array)

第二个参数(Function)

第三个参数作为数字

第三个参数作为字符串

toJSON 方法

相关推荐

取消回复欢迎你发表评论:

Vue自定义Hook示例:useUrlState（vue中的自定义指令如何使用）

Vue-实现自定义插件弹窗（vue 实现弹窗）

MySQL中这14个小玩意，让人眼前一亮!

旗舰机新标杆 OPPO Find X2系列正式发布售价5499元起

什么是幂等?分布式锁如何实现业务幂等?

如何快速切换node版本?利用n包快速切换nodejs版本

如何发个 npm 包?

手把手教你搞定菜单权限设计，精确到按钮级别，建议收藏

【Python机器学习系列】建立多层感知机模型预测心脏疾病

详解MySQL 字符串拼接之concat\concat_ws\group_concat

JSON.stringify()的使用 json.stringfly

前言

第二个参数(Array)

第二个参数(Function)

第三个参数作为数字

第三个参数作为字符串

toJSON 方法

相关推荐

取消回复欢迎 你 发表评论:

Vue自定义Hook示例:useUrlState（vue中的自定义指令如何使用）

Vue-实现自定义插件弹窗（vue 实现弹窗）

MySQL中这14个小玩意，让人眼前一亮!

旗舰机新标杆 OPPO Find X2系列正式发布 售价5499元起

什么是幂等?分布式锁如何实现业务幂等?

如何快速切换node版本?利用n包快速切换nodejs版本

如何发个 npm 包?

手把手教你搞定菜单权限设计，精确到按钮级别，建议收藏

【Python机器学习系列】建立多层感知机模型预测心脏疾病

详解MySQL 字符串拼接之concat\concat_ws\group_concat

取消回复欢迎你发表评论:

旗舰机新标杆 OPPO Find X2系列正式发布售价5499元起