JS实现JSON.stringify的实例代码讲解


Posted in Javascript onFebruary 07, 2017

 JSON.stringify是浏览器高版本带的一个将JS的Objtect对象转换为JSON字符串的一个方法,不过再IE6下面,并不存在JSON这一对象,因此,用到此方法时,需要写一套兼容性的代码。 JSON.stringify的一些规则以及注意点:当对象为数字,null,boolean的时候,直接转换为相应的字符串就可以了。 但是string,function,undefined,object,array等,需要特殊处理。

1.undefined,该类型使用JSON.stringify处理的时候,如果对象就是undefined,将会输出"undefined",如果对象是数组的元素,那么将会变成null,比如:[undefined],stringify之后变成了"[null]";如果该对象是object的元素,那么该属性将当作不存在,不输出,比如{a:1,b:undefined},stringify之后是"{\"a\":1},B属性直接抛弃。

2.字符串在拼接的时候需要把内部的双引号处理掉

代码如下

/** 
 * JSON stringify的实现 
 * @author norkts<norkts@gmail.com> 
 * @version 1.0 2015-11-24 15:11 实现了基本功能 
 * @version 1.1 2015-11-24 15:19 norkts 增加了JSON.stringify的兼用代码实现 
 * @version 1.2 2015-11-24 15:49 norkts 修改数组indexOf在IE下不兼容的写法,修改了undefined值的特殊处理 
 */ 
(function(NS){ 
 
 //简单类型 
 var simpleTypes = ["number", "boolean", "undefined", "string", "function"]; 
  
 //JSON.stringify的主函数 
 function stringify(object){ 
  var type = typeof object; 
   
  //如果是简单类型,则直接返回简单类型的结果 
  if(indexOf(simpleTypes, type) > -1){ 
   return parseSimpleObject(object); 
  } 
 
  //数组对象的 
  if(object instanceof Array){ 
   var len = object.length; 
   var resArr = []; 
   for(var i = 0; i < len; i++){ 
    var itemType = typeof object[i]; 
    if(indexOf(simpleTypes, itemType) > -1){ 
 
     //undefined特殊处理,数组中变成null 
     if(itemType != "undefined"){ 
      resArr.push(parseSimpleObject(object[i])); 
     }else{ 
      resArr.push("null"); 
     } 
      
    }else{ 
     //递归处理JS数组中的复杂元素 
     resArr.push(stringify(object[i])); 
    } 
   } 
    
   return "[" + resArr.join(",") + "]"; 
  } 
   
  //普通object对象 
  if(object instanceof Object){ 
   if(object == null){ 
    return "null"; 
   } 
    
   var resArr = []; 
    
   for(var name in object){ 
    var itemType = typeof object[name]; 
    if(indexOf(simpleTypes, itemType) > -1){ 
     //undefined特殊处理,object中不编码 
     if(itemType != "undefined"){ 
      resArr.push("\"" + name + "\":" + parseSimpleObject(object[name]));  
     } 
    }else{ 
     resArr.push("\"" + name + "\":" + stringify(object[name])); 
    } 
   } 
    
   return "{" + resArr.join(",") + "}"; 
  } 
 } 
  
 function parseSimpleObject(object){ 
  var type = typeof object; 
  if(type == "string" || type == "function"){ 
   return "\"" + object.toString().replace("\"", "\\\"") + "\""; 
  } 
   
  if(type == "number" || type == "boolean"){ 
   return object.toString(); 
  } 
   
  if(type == "undefined"){ 
   return "undefined"; 
  } 
   
  return "\"" + object.toString().replace("\"", "\\\"") + "\""; 
 } 
  
 function indexOf(arr, val){ 
  for(var i = 0; i < arr.length; i++){ 
   if(arr[i] === val){ 
    return i; 
   } 
  } 
   
  return -1; 
 } 
  
 /** 
  * 将stringify做二次封装 
  * @param object 要处理的对象 
  * 
  */ 
 NS.stringify = function(object, isEncodeZh){ 
  var res = stringify(object); 
  if(isEncodeZh){ 
   var encodeRes = ""; 
   for(var i = 0; i < res.length; i++){ 
    if(res.charCodeAt(i) < 0xff){ 
     encodeRes += res[i]; 
    }else{ 
     encodeRes += "\\u" + res.charCodeAt(i).toString(16); 
    } 
   } 
   res = encodeRes; 
  } 
   
  return res; 
 }; 
})(window);

以上所述是小编给大家介绍的JS实现JSON.stringify的实例代码讲解,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
复制本贴标题和地址的js代码
Jul 01 Javascript
JAVASCRIPT下判断IE与FF的比较简单的方式
Oct 17 Javascript
javascript函数中的arguments参数
Aug 01 Javascript
JS将表单导出成EXCEL的实例代码
Nov 11 Javascript
javascript表单验证使用示例(javascript验证邮箱)
Jan 07 Javascript
js使用removeChild方法动态删除div元素
Aug 01 Javascript
每天一篇javascript学习小结(属性定义方法)
Nov 19 Javascript
JavaScript实现HTML5游戏断线自动重连的方法
Sep 18 Javascript
Vue props用法详解(小结)
Jul 03 Javascript
详解Webpack loader 之 file-loader
Nov 07 Javascript
jQuery实现点击旋转,再点击恢复初始状态动画效果示例
Dec 11 jQuery
js里面的变量范围分享
Jul 18 Javascript
jQuery简单获取DIV和A标签元素位置的方法
Feb 07 #Javascript
JS日程管理插件FullCalendar简单实例
Feb 07 #Javascript
纯js三维数组实现三级联动效果
Feb 07 #Javascript
在点击div中的p时,如何阻止事件冒泡
Feb 07 #Javascript
bootstrap vue.js实现tab效果
Feb 07 #Javascript
Node连接mysql数据库方法介绍
Feb 07 #Javascript
jQuery监听浏览器窗口大小的变化实例
Feb 07 #Javascript
You might like
php按百分比生成缩略图的代码分享
2014/05/10 PHP
php从身份证获取性别和出生年月
2017/02/09 PHP
yii2.0整合阿里云oss的示例代码
2017/09/19 PHP
JS中字符问题(二进制/十进制/十六进制及ASCII码之间的转换)
2008/11/03 Javascript
jquery 圆形旋转图片滚动切换效果
2011/01/19 Javascript
使用js修改客户端注册表的方法
2013/08/09 Javascript
js数组的操作指南
2014/12/28 Javascript
jQuery解析json格式数据简单实例
2016/01/22 Javascript
jQuery取消特定的click事件
2016/02/29 Javascript
javascript截图 jQuery插件imgAreaSelect使用详解
2016/05/04 Javascript
用AngularJS的指令实现tabs切换效果
2016/08/31 Javascript
jquery.Callbacks的实现详解
2016/11/30 Javascript
js转换对象为xml
2017/02/17 Javascript
React从react-router路由上做登陆验证控制的方法
2018/05/10 Javascript
简单了解JS打开url的方法
2020/02/21 Javascript
不依任何赖第三方,单纯用vue实现Tree 树形控件的案例
2020/09/21 Javascript
vue+vant 上传图片需要注意的地方
2021/01/03 Vue.js
vue浏览器返回监听的具体步骤
2021/02/03 Vue.js
[43:51]2018DOTA2亚洲邀请赛3月30日 小组赛B组 EG VS Secret
2018/03/31 DOTA
python3.x上post发送json数据
2018/03/04 Python
python3+PyQt5使用数据库窗口视图
2018/04/24 Python
Django实现表单验证
2018/09/08 Python
Python3爬虫全国地址信息
2019/01/05 Python
Python实现通过解析域名获取ip地址的方法分析
2019/05/17 Python
django 连接数据库 sqlite的例子
2019/08/14 Python
Linux下通过python获取本机ip方法示例
2019/09/06 Python
下载官网python并安装的步骤详解
2019/10/12 Python
win7下 python3.6 安装opencv 和 opencv-contrib-python解决 cv2.xfeatures2d.SIFT_create() 的问题
2019/10/24 Python
Python开发之pip安装及使用方法详解
2020/02/21 Python
keras 自定义loss损失函数,sample在loss上的加权和metric详解
2020/05/23 Python
定制iPhone和Macbook保护壳:Slick Case
2018/11/21 全球购物
实习生体会的自我评价范文
2013/11/28 职场文书
公司员工安全协议书
2014/11/21 职场文书
2014年法务工作总结
2014/12/11 职场文书
学生上课迟到检讨书
2015/01/01 职场文书
我的收音机情缘
2022/04/05 无线电