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 相关文章推荐
Javascript实现的类似Google的Div拖动效果代码
Aug 09 Javascript
在javascript中对于DOM的加强
Apr 11 Javascript
js动态为代码着色显示行号
May 29 Javascript
javascript实现点击单选按钮链接转向对应网址的方法
Aug 12 Javascript
javascript图片滑动效果实现
Jan 28 Javascript
深入浅析JSON.parse()、JSON.stringify()和eval()的作用详解
Apr 03 Javascript
使用jquery提交form表单并自定义action的方法
May 25 Javascript
Bootstrap源码解读下拉菜单(4)
Dec 23 Javascript
JavaScript实现审核流程状态的动态显示进度条
Mar 15 Javascript
node实现的爬虫功能示例
May 04 Javascript
jquery中为什么能用$操作
Jun 18 jQuery
JavaScript实现点击自制菜单效果
Feb 02 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
成本8450万,票房仅2亿,口碑两极分化,又一部DC电影扑街了
2020/04/09 欧美动漫
php join函数应用
2011/05/04 PHP
php中将数组存到文件里的实现代码
2012/01/19 PHP
PHP单态模式简单用法示例
2016/11/16 PHP
针对thinkPHP5框架存储过程bug重写的存储过程扩展类完整实例
2018/06/16 PHP
Laravel统计一段时间间隔的数据方法
2019/10/09 PHP
PHP fopen中文文件名乱码问题解决方案
2020/10/28 PHP
改变javascript函数内部this指针指向的三种方法
2010/04/23 Javascript
在Linux上用forever实现Node.js项目自启动
2014/07/09 Javascript
jQuery实现Div拖动+键盘控制综合效果的方法
2015/03/10 Javascript
使用JavaScript刷新网页的方法
2015/06/04 Javascript
JS组件Bootstrap实现弹出框效果代码
2016/04/26 Javascript
javascript基础语法——全面理解变量和标识符
2016/06/02 Javascript
jQuery Easyui加载表格出错时在表格中间显示自定义的提示内容
2016/12/08 Javascript
jQuery窗口拖动功能的实现代码
2017/02/04 Javascript
angularjs下拉框空白的解决办法
2017/06/20 Javascript
IScroll那些事_当内容不足时下拉刷新的解决方法
2017/07/18 Javascript
js回调函数原理与用法案例分析
2020/03/04 Javascript
Python编程求质数实例代码
2018/01/31 Python
pyqt5 lineEdit设置密码隐藏,删除lineEdit已输入的内容等属性方法
2019/06/24 Python
Python开发之pip安装及使用方法详解
2020/02/21 Python
你不知道的5个HTML5新功能
2016/06/28 HTML / CSS
HTML5新特性之type=file文件上传功能
2018/02/02 HTML / CSS
捷克汽车配件和工具销售网站:TorriaCars
2018/02/26 全球购物
Mio Skincare法国官网:身体紧致及孕期身体护理
2018/04/04 全球购物
在线购买澳大利亚设计师手拿包和奢华晚装手袋:Olga Berg
2019/03/20 全球购物
介绍一下MD5加密算法
2016/11/12 面试题
Linux不知道文件后缀名怎么判断文件类型
2014/08/21 面试题
大学毕业通用个人的求职信
2013/12/08 职场文书
本科生的职业生涯规划范文
2014/01/09 职场文书
致跳高运动员广播稿
2014/01/13 职场文书
电气个人求职信范文
2014/02/04 职场文书
青春飞扬演讲稿
2014/09/11 职场文书
竞聘开场白方式有哪些?
2019/08/28 职场文书
Vue全家桶入门基础教程
2021/05/14 Vue.js
SQLServer中exists和except用法介绍
2021/12/04 SQL Server