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 相关文章推荐
Mootools 1.2教程 输入过滤第一部分(数字)
Sep 15 Javascript
jQuery学习2 选择器的使用说明
Feb 07 Javascript
JS获取URL中参数值(QueryString)的4种方法分享
Apr 12 Javascript
一个简单的jquery的多选下拉框(自写)
May 05 Javascript
JavaScript基础语法、dom操作树及document对象
Dec 02 Javascript
原生js封装二级城市下拉列表的实现代码
Jun 16 Javascript
JS简单实现tab切换效果的多窗口显示功能
Sep 07 Javascript
BetterScroll 在移动端滚动场景的应用
Sep 18 Javascript
使用Vue制作图片轮播组件思路详解
Mar 21 Javascript
Layui多选只有最后一个值的解决方法
Sep 02 Javascript
jquery实现购物车基本功能
Oct 25 jQuery
Node.js API详解之 console模块用法详解
May 12 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截断标题且兼容utf8和gb2312编码
2013/09/22 PHP
PHP中使用file_get_contents抓取网页中文乱码问题解决方法
2014/12/17 PHP
Yii框架在页面输出执行sql语句以方便调试的实现方法
2014/12/24 PHP
简单谈谈php浮点数精确运算
2016/03/10 PHP
PHP中spl_autoload_register()函数用法实例详解
2016/07/18 PHP
thinkPHP5框架分页样式类完整示例
2018/09/01 PHP
Javascript学习笔记6 prototype的提出
2010/01/11 Javascript
html5+javascript制作简易画板附图
2014/04/25 Javascript
jQuery+HTML5加入购物车代码分享
2020/10/29 Javascript
JavaScript File API文件上传预览
2016/02/02 Javascript
Bootstrap项目实战之子栏目资讯内容
2016/04/25 Javascript
Javascript实现图片加载从模糊到清晰显示的方法
2016/06/21 Javascript
Backbone中View之间传值的学习心得
2016/08/09 Javascript
jQuery将表单序列化成一个Object对象的实例
2016/11/29 Javascript
微信小程序 this和that详解及简单实例
2017/02/13 Javascript
javascript 组合按键事件监听实现代码
2017/02/21 Javascript
详解HTTPS 的原理和 NodeJS 的实现
2017/07/04 NodeJs
js实现登录与注册界面
2017/11/01 Javascript
微信小程序loading组件显示载入动画用法示例【附源码下载】
2017/12/09 Javascript
vue 弹框产生的滚动穿透问题的解决
2018/09/21 Javascript
Python函数嵌套实例
2014/09/23 Python
Python中运行并行任务技巧
2015/02/26 Python
python网络爬虫 CrawlSpider使用详解
2019/09/27 Python
python写一个随机点名软件的实例
2019/11/28 Python
python中rb含义理解
2020/06/18 Python
python使用QQ邮箱实现自动发送邮件
2020/06/22 Python
使用keras时input_shape的维度表示问题说明
2020/06/29 Python
屈臣氏官方旗舰店:亚洲享负盛名的保健及美妆零售商
2019/03/15 全球购物
Carrs Silver官网:英国著名的银器品牌
2020/08/29 全球购物
总监职责范文
2013/11/09 职场文书
饭店工作计划书
2014/01/10 职场文书
《三袋麦子》教学反思
2014/03/02 职场文书
出纳试用期自我鉴定
2014/04/07 职场文书
2015年物业管理员工工作总结
2015/10/15 职场文书
《跨越海峡的生命桥》教学反思
2016/02/18 职场文书
pytorch 如何使用float64训练
2021/05/24 Python