json对象转字符串如何实现


Posted in Javascript onDecember 02, 2012

背景:大部分浏览器已经实现了json对象转字符串的原生api支持,那在较低版本浏览器浏览器——如大家最喜爱的IE6——里如何实现呢?
首先运行以下方法,测试各种情况下,JSON.stringify的输出,这有助于下文代码的实现以及测试。用例不一定完整,欢迎补充

function test_toStringify(){ 

var result = { 

"JSON.stringify(undefined)": JSON.stringify(undefined), 

"JSON.stringify(null)": JSON.stringify(null), 

"JSON.stringify(123)": JSON.stringify(123), 

"JSON.stringify(true)": JSON.stringify(true), 

"JSON.stringify('')": JSON.stringify(''), 

"JSON.stringify('abc')": JSON.stringify('abc'), 

"JSON.stringify(null)": JSON.stringify(null), 

"JSON.stringify([1,2,3])": JSON.stringify([1,2,3]), 

"JSON.stringify([undefined, undefined])": JSON.stringify([undefined, undefined]), 

"JSON.stringify({name:'chyingp', age:24, u:undefined})": JSON.stringify({name:'chyingp', age:24, u:undefined}) 

}; 

var str = ''; 

for(var key in result){ 

if(typeof result[key] === 'string'){ 

str += key + " : '" + result[key] + "'\n"; 

}else{ 

str += key + " : " + result[key] + "\n"; 

} 

} 

console.log(str); 

} 

test_toStringify();

输出结果如下:
JSON.stringify(undefined) : undefined 

JSON.stringify(null) : 'null' 

JSON.stringify(123) : '123' 

JSON.stringify(true) : 'true' 

JSON.stringify('') : '""' 

JSON.stringify('abc') : '"abc"' 

JSON.stringify([1,2,3]) : '[1,2,3]' 

JSON.stringify([undefined, undefined]) : '[null,null]' 

JSON.stringify({name:'chyingp', age:24, u:undefined}) : '{"name":"chyingp","age":24}'

下面是json对象转字符串的代码实现:
function is_number(obj){ return Object.prototype.toString.call(obj)==='[object Number]'; } 

function is_boolean(obj){ return Object.prototype.toString.call(obj)==='[object Boolean]'; } 

function is_string(obj){ return Object.prototype.toString.call(obj)==='[object String]'; } 

function is_null(obj){ return Object.prototype.toString.call(obj)==='[object Null]'; } 

function is_undefined(obj){ return Object.prototype.toString.call(obj)==='[object Undefined]'; } 

function is_object(obj){ return Object.prototype.toString.call(obj)==='[object Object]'; } 

function is_array(obj){ return Object.prototype.toString.call(obj)==='[object Array]'; } 

function is_function(obj){ return Object.prototype.toString.call(obj)==='[object Function]'; } 

function quote(str){ return '"' + str + '"'; } 

var basic_map = { 

'[object Undefined]': true, 

'[object Number]': true, 

'[object Null]': true, 

'[object Boolean]': true 

} 

function basic_type(obj){ return basic_map[ Object.prototype.toString.call(obj) ]; } 

JSON = window.JSON || {}; 

//其实就是JSON.stringify 

JSON.toStr = function(obj){ 

if(is_string(obj) || is_null(obj) || is_number(obj) || is_boolean(obj)) return quote(obj); 

if(is_undefined(obj)) return obj; 

if(is_array(obj)){ 

var left = "[", 

middle = [], 

right = "]", 

value; 

var callee = arguments.callee; 

for(var i=0,len=obj.length; i<len; i++){ 

var value = obj[i]; 

if( typeof value === 'undefined' ){ 

middle.push(null+''); 

}else{ 

if( basic_type(value) ){ 

middle.push( value ) 

}else{ 

middle.push( callee(obj[i]) ) 

} 

} 

} 

return left+ middle.join(",") +right; 

} 

if(is_object(obj)){ 

var left = "{", 

middle = [], 

right = "}", 

value ; 

var callee = arguments.callee; 

for(var key in obj){ 

var value = obj[key]; 

if(typeof obj[key] === 'undefined') continue; 

if( basic_type(value) ){ 

middle.push( quote(key) + ':'+ value ); 

}else{ 

middle.push( quote(key) + ':'+ callee(value) ); 

} 

} 

return left + middle.join(', ') + right; 

} 

}; 

!JSON.stringify && (JSON.stringify = JSON.toStr);

以上代码仅为练手用,如有冗余及效率问题敬请见谅。如有错误则请帮忙指出 :)
Javascript 相关文章推荐
jQuery 数据缓存data(name, value)详解及实现
Jan 04 Javascript
基于jquery实现的鼠标滑过按钮改变背景图片
Jul 15 Javascript
yepnope.js 异步加载资源文件
Sep 08 Javascript
jQuery学习笔记 操作jQuery对象 CSS处理
Sep 19 Javascript
javascript检测对象中是否存在某个属性判断方法小结
May 19 Javascript
JS中FRAME的操作问题实例分析
Oct 21 Javascript
点评js异步加载的4种方式
Dec 22 Javascript
JavaScript程序中实现继承特性的方式总结
Jun 24 Javascript
原生JS实现-星级评分系统的简单实例
Aug 21 Javascript
Node.js用readline模块实现输入输出
Dec 16 Javascript
vue.js数据绑定的方法(单向、双向和一次性绑定)
Jul 13 Javascript
详解js跨域请求的两种方式,支持post请求
May 05 Javascript
javascript 构造函数强制调用经验总结
Dec 02 #Javascript
js精度溢出解决方案
Dec 02 #Javascript
JavaScript词法作用域与调用对象深入理解
Nov 29 #Javascript
浏览器加载、渲染和解析过程黑箱简析
Nov 29 #Javascript
javascript控制swfObject应用介绍
Nov 29 #Javascript
javascript 保存文件到本地实现方法
Nov 29 #Javascript
jquery连缀语法如何实现
Nov 29 #Javascript
You might like
thinkphp中空模板与空模块的用法实例
2014/11/26 PHP
linux下实现定时执行php脚本
2015/02/13 PHP
php二维码生成
2015/10/19 PHP
php中实现进程锁与多进程的方法
2016/09/18 PHP
Lazy Load 延迟加载图片的 jQuery 插件
2010/02/06 Javascript
javascript innerHTML使用分析
2010/12/03 Javascript
最好用的省市二级联动 原生js实现你值得拥有
2013/09/22 Javascript
jQuery 获取和设置select下拉框的值实现代码
2013/11/08 Javascript
jquery实现像栅栏一样左右滑出式二级菜单效果代码
2015/08/24 Javascript
jQuery zclip插件实现跨浏览器复制功能
2015/11/02 Javascript
JavaScript实现多种排序算法
2016/02/24 Javascript
解决AjaxFileupload 上传时会出现连接重置的问题
2017/07/07 Javascript
vue elementUI 表单校验功能之数组多层嵌套
2019/06/04 Javascript
微信小程序使用蓝牙小插件
2019/09/23 Javascript
Vue替代marquee标签超出宽度文字横向滚动效果
2019/12/09 Javascript
[02:15]2015国际邀请赛选手档案IG.Ferrari 430
2015/07/30 DOTA
[38:32]DOTA2上海特级锦标赛A组资格赛#2 Secret VS EHOME第二局
2016/02/26 DOTA
[54:15]DOTA2-DPC中国联赛 正赛 DLG vs Dragon BO3 第二场2月1日
2021/03/11 DOTA
浅谈MySQL中的触发器
2015/05/05 Python
Python自动化测试Eclipse+Pydev 搭建开发环境
2016/08/15 Python
python 自动去除空行的实例
2018/07/24 Python
python自制包并用pip免提交到pypi仅安装到本机【推荐】
2019/06/03 Python
python每天定时运行某程序代码
2019/08/16 Python
详解PyTorch中Tensor的高阶操作
2019/08/18 Python
CSS3弹性布局内容对齐(justify-content)属性使用详解
2017/07/31 HTML / CSS
英国高街奥特莱斯:Highstreet Outlet
2019/11/21 全球购物
莫斯科珠宝厂官方网站:Miuz
2020/09/19 全球购物
医学护理系毕业生求职信
2013/10/01 职场文书
中医专业应届生求职信
2013/11/17 职场文书
应届生求职自荐信范文
2014/04/07 职场文书
加强作风建设工作总结
2014/10/23 职场文书
2019年健身俱乐部的创业计划书
2019/08/26 职场文书
关于python爬虫应用urllib库作用分析
2021/09/04 Python
Springboot/Springcloud项目集成redis进行存取的过程解析
2021/12/04 Redis
十大最强水系宝可梦,最美宝可梦排第三,榜首大家最熟悉
2022/03/18 日漫
spring 项目实现限流方法示例
2022/07/15 Java/Android