如何用jQuery/JavaScript解析JSON？Ajax调用WebService解析报错求助

嘿，我来帮你搞定这个JSON解析的问题！咱们先拆解一下问题根源，再给你对应的解决方案。

问题出在哪？ #

你拿到的Web服务返回值其实是两层JSON序列化的结果：外层是一个包含d字段的对象，而d字段的值本身又是一个被JSON序列化过的数组字符串。直接解析整个response只能得到一个带字符串属性的对象，没法直接用里面的数组数据，这就是你后续操作出错的原因。

看你的原代码执行结果：

var response = '{"d":"[{\"username\":\"ABC\",\"designation\":\"\"}]"}';
console.log(JSON.parse(response));

输出会是这样：

{ d: "[{\"username\":\"ABC\",\"designation\":\"\"}]" }

d的值是字符串，不是你预期的数组，自然没法直接按数组去操作。

正确的解析方法 #

你需要做两次JSON解析：先解析外层的对象，再把d字段里的字符串转成数组。代码示例如下：

var response = '{"d":"[{\"username\":\"ABC\",\"designation\":\"\"}]"}';
// 第一步：解析外层的JSON对象
var parsedOuter = JSON.parse(response);
// 第二步：解析d字段中的字符串，得到目标数组
var userData = JSON.parse(parsedOuter.d);

// 现在就能正常使用数组数据了
console.log(userData); // 输出: [{username: "ABC", designation: ""}]
console.log(userData[0].username); // 输出: ABC

为什么会有这种嵌套结构？ #

这种情况常见于老版本的ASP.NET Web服务，它们会把实际返回的数据自动包装在d字段中，并且额外做一次序列化，导致最终返回结果是两层JSON结构。记住做两次解析就能轻松解决这个问题啦。

内容的提问来源于stack exchange，提问作者Gans