一、技术背景

在前端开发中，字符串与 JSON 对象的相互转换是数据处理的核心场景（如 AJAX 接收后端字符串、本地存储数据解析等）。JSON 作为轻量级数据格式，其语法严格性与 JavaScript 对象字面量存在差异，这也是不同转换方法兼容性、安全性、性能差异的根源。

核心概念区分

• JSON 字符串：符合 JSON 语法规范的字符串（键名必须双引号、值为合法 JSON 类型），如'{"name":"小强"}'；
• JavaScript 对象：内存中的原生对象，键名可省略引号 / 用单引号，如{name: "小强"}；
• 转换本质：字符串转 JSON 的过程，是将文本格式解析为可操作的 JS 对象，不同方法的核心差异在于解析引擎、语法容错性、安全性。

二、字符串转 JSON 的四种方法

第一种方式：使用 js 函数 eval ()

核心问题：eval()是 JavaScript 的全局函数，可执行任意字符串形式的代码，解析 JSON 时需用括号包裹以避免语法歧义（JSON 对象的{}会被解析为代码块而非对象）。  

  代码示例

function ConvertToJsonForJs() {

//var testJson = "{ name: '小强', age: 16 }";(支持)

//var testJson = "{ 'name': '小强', 'age': 16 }";(支持)

var testJson = '{ "name": "小强", "age": 16 }';

//testJson=eval(testJson);//错误的转换方式

testJson = eval("(" + testJson + ")");

alert(testJson.name);

}

：

1. 语法容错性：eval()对非标准 JSON 格式兼容性高（如键名无引号、单引号包裹值），但这也是安全风险的来源；
2. 安全风险：若解析的字符串包含恶意代码（如"{name: '小强'}; alert('攻击')"），eval()会直接执行，导致 XSS 攻击或数据泄露；
3. 性能特点：eval()执行速度快，但因无语法校验和安全过滤，仅适用于完全可信的本地数据（如前端固定字符串），禁止用于解析用户输入、后端返回的不可信数据。

第二种方式：使用 jquery.parseJSON ()

核心特点：jQuery 提供的专用 JSON 解析方法，严格遵循 JSON 语法规范，容错性低但安全性高。

代码示例 

function ConvertToJsonForJq() {

var testJson = '{ "name": "小强", "age": 16 }';

//不知道

//'{ name: "小强", age: 16 }' (name 没有使用双引号包裹)

//"{ 'name': "小强", 'age': 16 }"(name使用单引号)

testJson = $.parseJSON(testJson);

alert(testJson.name);

}

1. 语法要求：必须满足 JSON 官方规范 —— 键名必须用双引号包裹、字符串值必须双引号、不能有多余逗号，否则直接抛出错误；
2. 底层实现：jQuery 1.9 + 版本中，$.parseJSON()在支持原生JSON.parse的浏览器中会直接调用原生方法，仅在老旧浏览器（IE7-）中使用兼容解析逻辑；
3. 错误处理：解析非法 JSON 时会抛出SyntaxError，建议配合try-catch使用

第三种方式：使用 Function 来进行转换

核心原理：通过动态创建匿名函数，将 JSON 字符串作为函数返回值执行，本质与eval()类似但封装性更强。

代码示例

var jsonStr = '{"userName": "tiu","userAge": 26,"isMale": true}';

var json = (new Function("return " + jsonStr))();

关键说明：

1. 执行逻辑：new Function("return " + jsonStr)创建一个函数，函数体为return {"userName": "tiu"...}，调用该函数即返回解析后的对象；
2. 对比 eval ()： 相同点：容错性高（支持非标准 JSON）、存在安全风险（可执行恶意代码）； 不同点：Function解析时作用域更隔离，不会污染全局作用域，性能略低于eval()；
3. 适用场景：仅适用于可信数据，且需兼容老旧浏览器（如 Firefox 2/3）的场景（早期测试表明 Firefox 中Function性能优于eval()）。

第四种方式：使用 JSON 全局对象

核心特点：ECMAScript 5 规范引入的原生 JSON 对象，包含JSON.parse()（字符串转对象）和JSON.stringify()（对象转字符串），是现代浏览器的最优选择。

代码示例

var jsonStr = '{"userName": "tiu","userAge": 26,"isMale": true}';

var json = JSON.parse(jsonStr);

var str = JSON.stringify(json);

三、常见问题与解决方案

1. 解析报错 “Unexpected token”： 原因：JSON 字符串格式不标准（如单引号、键名无引号、多余逗号）； 解决：清洗字符串后用JSON.parse()，或使用try-catch捕获错误。
2. IE7 及以下无 JSON 对象： 解决：引入 JSON3.js（轻量级 polyfill），自动适配原生 / 兼容实现。
3. 解析后数据类型异常： 原因：后端返回的数字 / 布尔值为字符串类型； 解决：使用JSON.parse()的 reviver 函数统一转换类型。