说在前面
平时大家都是怎么将
json对象
转为json字符串
的?大部分同学应该都是直接使用内置的JSON.stringify
函数来进行转换的吧?今天我们一起来看看不用JSON.stringify
怎么将json对象
转为json字符串
。
需求
现给定一个值,返回该值的有效 JSON 字符串。你可以假设这个值只包括字符串、整数、数组、对象、布尔值和 null。返回的字符串不能包含额外的空格。键的返回顺序应该与 Object.keys() 的顺序相同。
在不使用内置方法 JSON.stringify 的前提下解决这个问题。
示例
示例 1
输入:object = {"y":1,"x":2}
输出:{"y":1,"x":2}
解释:
返回该对象的 JSON 表示形式。
注意,键的返回顺序应该与 Object.keys() 的顺序相同。
示例 2
输入:object = {"a":"str","b":-12,"c":true,"d":null}
输出:{"a":"str","b":-12,"c":true,"d":null}
解释:
JSON 的基本类型是字符串、数字型、布尔值和 null。
示例 3
输入:object = {"key":{"a":1,"b":[{},null,"Hello"]}}
输出:{"key":{"a":1,"b":[{},null,"Hello"]}}
解释:
对象和数组可以包括其他对象和数组。
示例 4
输入:object = true
输出:true
解释:
基本类型是有效的输入
逻辑分析
基础类型处理
- 处理 null:如果输入的
object
是null
,直接返回字符串"null"
,这是JSON格式中对null
的标准表示方式。 - 处理字符串类型:当
object
是字符串类型时,通过将其用双引号括起来的方式返回符合JSON规范的字符串表示,即返回"${object}"
。例如,输入"hello"
,则返回"\"hello\""
。 - 处理非对象类型(除字符串外):如果
object
的类型不是对象(通过typeof
判断),这里排除了已经单独处理的字符串类型,那么就直接将其转换为字符串并返回。例如,对于数字5
,会返回"5"
;对于布尔值true
,会返回"true"
。
数组类型处理
- 首先通过
Array.isArray
函数进行判断输入的object
是否为数组。如果是数组,就遍历数组中的每个元素item
。 - 在遍历过程中,对于每个元素
item
:- 如果
res
(用于拼接最终结果字符串的变量)已经有内容了(即不是空字符串),就先在res
后面添加一个逗号,
,用于分隔不同的元素。 - 然后递归调用
jsonStringify
函数将当前元素item
转换为符合JSON格式的字符串,并将其添加到res
中。
- 如果
- 最后,将拼接好所有元素的字符串
res
用方括号[
和]
括起来并返回,形成一个符合JSON格式的数组字符串表示。例如,对于数组[1, "two", {three: 3}]
,会逐步将每个元素转换并拼接,最终返回"[1,\"two\",{\"three\":3}]"
。
对象类型处理
- 如果输入的
object
既不是基本类型(除字符串外)也不是数组类型,那么就认为它是普通对象类型。 - 对于对象类型,通过
for...in
循环遍历对象的所有键key
。 - 在遍历过程中,对于每个键
key
:- 同样,如果
res
已经有内容了,就在res
后面添加一个逗号,
。 - 分别递归调用
jsonStringify
函数将键key
和对应的值object[key]
转换为符合JSON格式的字符串,然后按照JSON规范的格式(键与值之间用冒号:
分隔)将它们拼接起来,即${jsonStringify(key)}:${jsonStringify(object[key])}
,并将拼接结果添加到res
中。
- 同样,如果
- 最后,将拼接好所有键值对的字符串
res
用花括号{
和}
,括起来并返回,形成一个符合JSON格式的对象字符串表示。例如,对于对象{name: "John", age: 30}
,会逐步将每个键值对转换并拼接,最终返回"{"name":"John","age":30}"
。
完整代码
/**
* @param {null|boolean|number|string|Array|Object} object
* @return {string}
*/
const jsonStringify = function (object) {
if (object === null) return "null";
if (typeof object === "string") return `"${object}"`;
if (typeof object !== "object") return object + "";
let res = "";
if (Array.isArray(object)) {
object.forEach((item) => {
if (res) res += ",";
res += jsonStringify(item);
});
return `[${res}]`;
}
for (const key in object) {
if (res) res += ",";
res += `${jsonStringify(key)}:${jsonStringify(object[key])}`;
}
return `{${res}}`;
};
测试
jsonStringify({"a":"str","b":-12,"c":true,"d":null});
//{"a":"str","b":-12,"c":true,"d":null}
jsonStringify({"key":{"a":1,"b":[{"c":"cc"},null,"Hello"]}});
//{"key":{"a":1,"b":[{"c":"cc"},null,"Hello"]}}
jsonStringify(true);
//true
jsonStringify("true");
//"true"
公众号
关注公众号『前端也能这么有趣
』,获取更多有趣内容。
说在后面
🎉 这里是 JYeontu,现在是一名前端工程师,有空会刷刷算法题,平时喜欢打羽毛球 🏸 ,平时也喜欢写些东西,既为自己记录 📋,也希望可以对大家有那么一丢丢的帮助,写的不好望多多谅解 🙇,写错的地方望指出,定会认真改进 😊,偶尔也会在自己的公众号『
前端也能这么有趣
』发一些比较有趣的文章,有兴趣的也可以关注下。在此谢谢大家的支持,我们下文再见 🙌。