在 Web 开发的核心场景 —— 前后端数据交互中，JSON 的核心应用之一就是将服务端返回的 JSON 数据转换为 JavaScript 对象，从而在网页中灵活调用这些数据。无论是读取 JSON 文件还是处理 HttpRequest 返回的 JSON 数据，完成这一转换是使用数据的前提。为了清晰理解这一过程，我们先从基础的字符串输入演示入手，逐步讲解 JSON 文本转 JavaScript 对象的方法，同时对比不同方式的安全性与效率，帮你掌握 JSON 使用的核心要点。

JSON 使用

把 JSON 文本转换为 JavaScript 对象

JSON 最常见的用法之一，是从 web 服务器上读取 JSON 数据（作为文件或作为 HttpRequest），将 JSON 数据转换为 JavaScript 对象，然后在网页中使用该数据。

为了更简单地为您讲解，我们使用字符串作为输入进行演示（而不是文件）。

JSON 实例 - 来自字符串的对象

创建包含 JSON 语法的 JavaScript 字符串：

var txt = '{ "sites" : [' +

'{ "name":" JSON在线  " , "url":"www.runoob.com" },' +

'{ "name":"google" , "url":"www.google.com" },' +

'{ "name":"微博" , "url":"www.weibo.com" } ]}';

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

eval() 函数使用的是 JavaScript 编译器，可解析 JSON 文本，然后生成 JavaScript 对象。必须把文本包围在括号中，这样才能避免语法错误：

var obj = eval ("(" + txt + ")");

在网页中使用 JavaScript 对象：

实例

var txt = '{ "sites" : [' +

'{ "name":" JSON在线  " , "url":"www.runoob.com" },' +

'{ "name":"google" , "url":"www.google.com" },' +

'{ "name":"微博" , "url":"www.weibo.com" } ]}';

var obj = eval ("(" + txt + ")");

document.getElementById("name").innerHTML=obj.sites[0].name 

document.getElementById("url").innerHTML=obj.sites[0].url

JSON 解析器

  eval() 函数可编译并执行任何 JavaScript 代码。这隐藏了一个潜在的安全问题。

使用 JSON 解析器将 JSON 转换为 JavaScript 对象是更安全的做法。JSON 解析器只能识别 JSON 文本，而不会编译脚本。

在浏览器中，这提供了原生的 JSON 支持，而且 JSON 解析器的速度更快。

较新的浏览器和最新的 ECMAScript (JavaScript) 标准中均包含了原生的对 JSON 的支持。

JSON 的核心使用场景是实现服务端数据到前端 JavaScript 对象的转换与应用，虽然 eval () 函数能完成基础的转换，但安全风险与性能问题使其并非最优选择。原生 JSON 解析器凭借更高的安全性、更快的解析速度，成为现代浏览器中处理 JSON 转换的首选方案。掌握这些转换方法的差异与适用场景，能让你在实际开发中更安全、高效地使用 JSON 数据，适配各类前后端交互需求。