在浏览器前端实现字符串转JSON对象,有多种方法,总结如下:

  • 方法1.  js函数,eval()

语法:

var obj = eval ("(" + txt + ")");  //必须把文本包围在括号中,这样才能避免语法错误

eval()定义:eval() 函数可计算某个字符串,并执行其中的的 JavaScript 代码。

由于 JSON 语法是 JavaScript 语法的子集,JavaScript 函数 eval() 可用于将 JSON 文本转换为 JavaScript 对象。

注意:当字符串中包含表达式时,eval() 函数也会编译并执行,转换会存在安全问题。

参考:JSON 使用 | 菜鸟教程,JavaScript eval() 函数

  • 方法2.  浏览器自带对象JSON,JSON.parse()

语法:

JSON.parse(text[, reviver])
//text:必需, 一个有效的 JSON 字符串。解析前要确保你的数据是标准的 JSON 格式,否则会解析出错。
//reviver: 可选,一个转换结果的函数, 将为对象的每个成员调用此函数。

JSON.parse()比eval()安全,而且速度更快。支持主流浏览器:Firefox 3.5,IE 8,Chrome,Opera 10,Safari 4。

注意:IE8兼容模式,IE 7,IE 6,会存在兼容性问题。

解决方法:引入json2.js(JSON官网)

<!--[if lte IE 7]>
<script src="json2.js"></script>
<![endif]-->

json2.js关键源码分析:

//paring过程分为4个步骤。
//第一个步骤是将unicode字符替换为转义字符。
//js在处理多种字符时是有问题的,不是悄悄的删掉他们,就是把他们当作行结束符。text = String(text);cx.lastIndex = 0;if (cx.test(text)) {text = text.replace(cx, function (a) {return '\\u' +('0000' + a.charCodeAt(0).toString(16)).slice(-4);});}//第二个步骤如下:
// In the second stage, we run the text against regular expressions that look
// for non-JSON patterns. We are especially concerned with '()' and 'new'
// because they can cause invocation, and '=' because it can cause mutation.
// But just to be safe, we want to reject all unexpected forms.// We split the second stage into 4 regexp operations in order to work around
// crippling inefficiencies in IE's and Safari's regexp engines. First we
// replace the JSON backslash pairs with '@' (a non-JSON character). Second, we
// replace all simple value tokens with ']' characters. Third, we delete all
// open brackets that follow a colon or comma or that begin the text. Finally,
// we look to see that the remaining characters are only whitespace or ']' or
// ',' or ':' or '{' or '}'. If that is so, then the text is safe for eval.if (/^[\],:{}\s]*$/.test(text.replace(/\\(?:["\\\/bfnrt]|u[0-9a-fA-F]{4})/g, '@').replace(/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g, ']').replace(/(?:^|:|,)(?:\s*\[)+/g, ''))) {//第三步骤:调用eval命令
//'{'在js中有语法歧义倾向:可以是程序块或者对象字面值。所以这里使用括号来避免歧义                j = eval('(' + text + ')');

json2.js关键源码

参考:JSON.parse() | 菜鸟教程,json2.js 简析(个人学习) - 奋斗小小鸟的专栏

  • 方法3.  引用jQuery插件,$.parseJSON()

语法:

$.parseJSON(json)  //json:String类型,传入格式有误的JSON字符串可能导致抛出异常

$.parseJSON()关键源码分析:

// Attempt to parse using the native JSON parser first
if ( window.JSON && window.JSON.parse ) {return window.JSON.parse( data );}// Make sure the incoming data is actual JSON
// Logic borrowed from http://json.org/json2.js
if ( rvalidchars.test( data.replace( rvalidescape, "@" ).replace( rvalidtokens, "]" ).replace( rvalidbraces, "")) ) {return ( new Function( "return " + data ) )();
}

$.parseJSON()关键源码

参考:jQuery.parseJSON()方法 | 菜鸟教程,jQuery静态方法parseJSON方法使用和源码分析 - -洋仔

  • 方法4.  AJAX请求获取JSON数据时,$.getJSON() 

语法:

jQuery.getJSON(url,data,success(data,status,xhr))
//url    必需。规定将请求发送的哪个 URL。
//data    可选。规定连同请求发送到服务器的数据。
//success(data,status,xhr)    可选。规定当请求成功时运行的函数。

这个时候返回的data已经是JSON对象,不需要再进行转换。

$.getJSON() 是简写的 Ajax 函数,等价于:

$.ajax({url: url,data: data,success: callback,dataType: "json"
});

参考:jQuery ajax - getJSON() 方法


 总结:

1.建议使用JSON.parse()方法;如果需兼容IE6/7,再引入json2.js文件(下载)。 相对应的JSON.stringify()方法,可用来将JSON对象转换为字符串

2.如果页面里已经引用jQuery,你又不想再引入多余文件(json2.js),也可以使用$.parseJSON()方法。

3.使用eval()时,必须保证字符串里没有可执行代码。

4.如果是通过AJAX获取JSON数据,直接用$.getJSON()函数,或者在$.ajax()中加入参数dataType: "json",就可以直接得到JSON对象。

参考:JS字符串转换为JSON的四种方法笔记 - 天使不哭 - 博客园

转载于:https://www.cnblogs.com/coolxiaoyi/p/11251765.html

总结js实现字符串转JSON对象的几种方法相关推荐

  1. js实现字符串转json对象的四种方法

    1. javascript函数eval() 语法: var obj = eval ("(" + txt + ")"); //必须把文本包围在括号中,这样才能避免 ...

  2. php将字符串转换为json格式,js中将字符串转换为json格式的三种方法

    json在js的开发过程中经常会用到,像在使用ajax开发的项目过程中,经常需要将json格式的字符串返回到前端,前端解析成json对象. 下面为大家介绍下将字符串转换为json对象的三种常用的方法: ...

  3. js 把字符串转成json对象的三种方法

    js 把字符串转成json对象的三种方法 不管字符串是否含有转义字符,都能转换成 Json 对象 1, js自带的eval函数,其中需要添加小括号eval('('+str+')'); function ...

  4. java json转抽象对象_做一次面向对象的体操:将 JSON 字符串转换为嵌套对象的一种方法...

    原标题:做一次面向对象的体操:将 JSON 字符串转换为嵌套对象的一种方法 来源:琴水玉 , www.cnblogs.com/lovesqcc/p/9478678.html 程序员共读整理发布,转载请 ...

  5. javascript中将字符串转换为json格式的三种方法

    摘自:http://www.phpzixue.cn/detail1128.shtml javascript中将字符串转换为json格式的三种方法:  json在我们js的开发过程中经常会用到像在使用a ...

  6. js 获取字符串最后一位的4种方法

    前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家.点击跳转到教程. 方法一:运用String对象下的charAt方法 charAt() 方法可返回指定位置的字符. 复制 ...

  7. js将字符串转换成数字的四种方法

    方法主要有四种 1转换函数.2强制类型转换.3利用js变量弱类型转换.4在字符串前面添加个+ 1.转换函数 js提供了parseInt()和parseFloat()两个转换函数.前者把值转换成整数,后 ...

  8. JS中遍历数组和对象的几种方法

    遍历对象 1.for...in.. for in遍历对象键值(key) 使用for in会遍历对象自身和继承的所有的可枚举属性. let obj = {Id: 001,Name: 'Lily',Age ...

  9. js删除字符串的最后一个字符三种方法

    字符串 [javascript] view plaincopy var basic = "abc,def,ghi,"; 第一种 [javascript] view plaincop ...

  10. js删除字符串的最后一个字符几种方法

    字符串:var s = "1,2,3,4,5," s=s.substring(0,s.length -1) s=s.substr(0,s.length - 1); s=s.subs ...

最新文章

  1. 使用Xshell连接Linux服务器
  2. 灰度图像--图像增强 非锐化掩蔽 (Unsharpening Mask) .
  3. 数据结构实验之链表四:有序链表的归并
  4. 处理字符串_4_计算某个字符出现的次数
  5. CSS布局最常用属性float(浮动)和position(定位)
  6. L. Coordinate Paper(CCPC 长春)构造
  7. html总结:文本框填满表格
  8. web.config中的globalization 标签在将几个不同服务器上的网闸内容以统一面貌集成在自己网站上时的要考虑的问题
  9. 猎鹰spacex_我从SpaceX中学到的关于开源的一切
  10. R40 gpio 寄存器地址操作【原创】
  11. C++ 处理异常相关
  12. 1-Java基础语法-Java初识
  13. 直接选择排序(Straight Selection Sort)
  14. EF+泛型修改方法(查询修改和不查询修改)
  15. c语言分数等级switch,用switch输出分数等级
  16. Linux99问,适合新手!
  17. win10系统 DNS服务器,dns出错?Win10系统dns服务器未响应的修复方法
  18. 比亚迪半导体IPO再生波折:又被中止审核 红杉小米是股东
  19. Web APIs --JavaScript学习笔记(总)(包括DOM、BOM)
  20. 二维离散余弦变换(DCT)与二维离散反余弦变换(IDCT)C语言实现

热门文章

  1. 怎么使用7zip进行分批压缩_7zip怎么使用 7zip使用方法教程
  2. 机器学习---黑箱原理
  3. SolidWorks工程图做到一半切换工程图模板的方法
  4. 又是被自己菜哭的一天。。
  5. 写书用什么软件好_微信加人软件什么样的引流效果好
  6. @DependsOn或depends-on配置的使用
  7. 基于PaddleOCR史上最全车牌号识别实现(二)
  8. linux iometer io
  9. adb的环境搭建,下载和卸载app
  10. apicloud如何对接大牛直播SDK