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 相关文章推荐
离开页面时检测表单元素是否被修改,提示保存的js代码
Aug 25 Javascript
简易js代码实现计算器操作
Apr 15 Javascript
仿谷歌主页js动画效果实现代码
Jul 14 Javascript
javascript在myeclipse中报错的解决方法
Oct 29 Javascript
根据user-agent判断蜘蛛代码黑帽跳转代码(js版与php版本)
Sep 14 Javascript
jQuery图片旋转插件jQueryRotate.js用法实例(附demo下载)
Jan 21 Javascript
jQuery validate插件实现ajax验证重复的2种方法
Jan 22 Javascript
jQuery 移动端拖拽(模块化开发,触摸事件,webpack)
Oct 28 Javascript
JavaScript程序设计高级算法之动态规划实例分析
Nov 24 Javascript
form表单数据封装成json格式并提交给服务器的实现方法
Dec 14 Javascript
jQuery实现文件编码成base64并通过AJAX上传的方法
Apr 12 jQuery
vue h5移动端禁止缩放代码
Oct 28 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
php 小乘法表实现代码
2009/07/16 PHP
php实现表单多按钮提交action的处理方法
2015/10/24 PHP
鼠标拖动实现DIV排序示例代码
2013/10/14 Javascript
JavaScript排序算法之希尔排序的2个实例
2014/04/04 Javascript
js简单实现交换Li的值
2014/05/22 Javascript
js取得html iframe中的元素和变量值
2014/06/30 Javascript
JavaScript中最简洁的编码html字符串的方法
2014/10/11 Javascript
javascript实现随时变化着的背景颜色
2015/04/02 Javascript
JavaScript生成二维码图片小结
2015/12/27 Javascript
Angularjs注入拦截器实现Loading效果
2015/12/28 Javascript
Bootstrap创建可折叠的组件
2016/02/23 Javascript
JS中把函数作为另一函数的参数传递方法(总结)
2017/06/28 Javascript
详解使用Visual Studio Code对Node.js进行断点调试
2017/09/14 Javascript
vue之父子组件间通信实例讲解(props、$ref、$emit)
2018/05/22 Javascript
微信小程序开发问题之wx.previewImage
2018/12/25 Javascript
vue中监听返回键问题
2019/08/28 Javascript
如何解决jQuery 和其他JS库的冲突
2020/06/22 jQuery
[06:16]DOTA2守卫传承者——职业选手谈心路历程
2015/02/26 DOTA
Python多进程同步Lock、Semaphore、Event实例
2014/11/21 Python
详解python中xlrd包的安装与处理Excel表格
2016/12/16 Python
python3.X 抓取火车票信息【修正版】
2018/06/19 Python
python通过TimedRotatingFileHandler按时间切割日志
2019/07/17 Python
pip install python 快速安装模块的教程图解
2019/10/08 Python
python多线程高级锁condition简单用法示例
2019/11/07 Python
python求最大公约数和最小公倍数的简单方法
2020/02/13 Python
五年级音乐教学反思
2014/02/06 职场文书
企业贷款委托书格式
2014/09/12 职场文书
办理护照工作证明
2014/10/10 职场文书
法定代表人授权委托书格式
2014/10/14 职场文书
2014年计划生育协会工作总结
2014/11/14 职场文书
2015元旦标语横幅
2014/12/09 职场文书
个人委托书范文
2015/01/28 职场文书
大学入学感言
2015/08/01 职场文书
JavaScript控制台的更多功能
2021/04/28 Javascript
java中重写父类方法加不加@Override详解
2021/06/21 Java/Android
Spring Boot 整合 Apache Dubbo的示例代码
2021/07/04 Java/Android