JSON的一个常见用途是作为与Web服务器交换资料。当向Web服务器传送资料时,资料必须是字串格式。使用JSON.stringify()可以将JavaScript物件转换为字串型别。那么如何通过原生javascript来实现这个功能呢?
实现思路
通过递回呼叫,来实现对转换物件Object的深层value进行遍历。利用array的join方法实现最终的字串拼接。
具体程式码
function json2str(o) {let arr = [];
const fmt = function(s) {
if(typeof s == \object\ && s !== null) return json2str(s);
return /^(string)$/.test(typeof s) ? `${s}`: s;
}
for (var i in o) arr.push(`${i}:${fmt(o[i])}`)
return `{${arr.join(\,\)}}`
}
const obj = { name: Lily, age: 30, tel: 132xxxxxxxx, address: { city : beijing, district: haidian, detail: dddddddd} };
const generatedData = json2str(obj)
对比JSON.stringify方法
可直接在浏览器执行如下程式码Create JSON string from a JavaScript object.
function json2str(o) {
let arr = [];
const fmt = function(s) {
if(typeof s == \object\ && s !== null) return json2str(s);
return /^(string)$/.test(typeof s) ? `${s}`: s;
}
for (var i in o) arr.push(`${i}:${fmt(o[i])}`)
return `{${arr.join(\,\)}}`
}
const obj = { name: John, age: 30, tel: 132xxxxxxxx, address: { city : beijing, district: haidian, detail: dddddddd} };
const myJSON = JSON.stringify(obj);
document.getElementById(demo).innerHTML = myJSON;
const myJSON2 = json2str(obj)
document.getElementById(demo2).innerHTML = myJSON2;
执行结果
小结
本文的JSON.stringify()方法的原生JS实现属于对javascript灵活应用的基本功。实现思路来自于笔者平日的工作与思考的总结。
希望大家都能掌握以便在面试中脱颖而出。
您的点赞和收藏是我知识输出的最大鼓励
有需要前端学习资料的同学可以私行小编“学习”,获取学习资料一起交流学习