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 相关文章推荐
基于jquery的滑动样例代码
Nov 20 Javascript
javascript对下拉列表框(select)的操作实例讲解
Nov 29 Javascript
js 3秒后跳转页面的实现代码
Mar 10 Javascript
js遍历子节点子元素附属性及方法
Aug 19 Javascript
jQuery实现复选框批量选择与反选的方法
Jun 17 Javascript
浅谈JavaScript中setInterval和setTimeout的使用问题
Aug 01 Javascript
比例尺、缩略图、平移缩放之百度地图添加控件方法
Aug 03 Javascript
JavaScript中日期的相关操作方法总结
Oct 24 Javascript
JS 仿支付宝input文本输入框放大组件的实例
Nov 14 Javascript
Vue中使用webpack别名的方法实例详解
Jun 19 Javascript
vue项目实现设置根据路由高亮对应的菜单项操作
Aug 06 Javascript
全局安装 Vue cli3 和 继续使用 Vue-cli2.x操作
Sep 08 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教程 基本语法
2009/10/23 PHP
PHP 观察者模式的实现代码
2013/05/10 PHP
JS获取IUSR_机器名和IWAM_机器名帐号的密码
2006/12/06 Javascript
Add a Table to a Word Document
2007/06/15 Javascript
jQuery 使用手册(五)
2009/09/23 Javascript
基于jquery异步传输json数据格式实例代码
2013/11/23 Javascript
JS 新增Cookie 取cookie值 删除cookie 举例详解
2014/10/10 Javascript
使用JS+plupload直接批量上传图片到又拍云
2014/12/01 Javascript
jquery获取及设置outerhtml的方法
2015/03/09 Javascript
JavaScript中String.match()方法的使用详解
2015/06/06 Javascript
JS禁用页面上所有控件的实现方法(附demo源码下载)
2015/12/17 Javascript
Bootstrap实现input控件失去焦点时验证
2016/08/04 Javascript
Vue.js项目中管理每个页面的头部标签的两种方法
2018/06/25 Javascript
不得不知的ES6小技巧
2018/07/28 Javascript
Js通过AES加密后PHP用Openssl解密的方法
2019/07/12 Javascript
详解Vue-cli3.X使用px2rem遇到的问题
2019/08/09 Javascript
详解如何在Vue项目中发送jsonp请求
2019/10/25 Javascript
Vuex中的Mutations的具体使用方法
2020/06/01 Javascript
[01:04:48]VGJ.S vs TNC Supermajor 败者组 BO3 第一场 6.6
2018/06/07 DOTA
Python错误处理操作示例
2018/07/18 Python
Python数据预处理之数据规范化(归一化)示例
2019/01/08 Python
解决pyqt5中QToolButton无法使用的问题
2019/06/21 Python
Python3 chardet模块查看编码格式的例子
2019/08/14 Python
windows下python安装pip方法详解
2020/02/10 Python
python实现简单井字棋小游戏
2020/03/05 Python
python生成word合同的实例方法
2021/01/12 Python
css3加js做一个简单的3D行星运转效果实例代码
2017/01/18 HTML / CSS
为智能设备设计个性化保护套网站:caseable
2017/01/05 全球购物
Draper James官网:知名演员瑞茜·威瑟斯彭所创品牌
2017/10/25 全球购物
巴西香水和化妆品购物网站:The Beauty Box
2019/09/03 全球购物
罗马尼亚在线杂货店:Pilulka.ro
2019/09/28 全球购物
营销与策划应届生求职信
2013/11/04 职场文书
党在我心中演讲稿
2014/09/02 职场文书
市委常委会班子党的群众路线教育实践活动整改方案
2014/10/25 职场文书
2015年敬老院工作总结
2015/05/18 职场文书
如何判断pytorch是否支持GPU加速
2021/06/01 Python