JavaScript中JSON字符串转换与异常处理实践

JSON 在前端里基本躲不开，接口返回、本地存储、用户表单，到处都能碰到。

字符串转对象用 JSON.parse，反过来用 JSON.stringify。这俩方法本身不复杂，真正让人烦的是 parse 遇到不合法字符串的时候直接抛错，不处理的话页面可能就断了。

JSON.parse 接收一个 JSON 格式的字符串，返回对应的 JavaScript 对象。比如 '{"name":"John","age":30,"city":"New York"}' 这种，直接传进去就能拿到对象，然后通过 .name 访问到 John。麻烦出在不是所有传进来的字符串都规范。属性名没加双引号，字符串值用了单引号，像 {name: 'John', age: 30, city: 'New York'} 这种，直接 parse 就会抛语法错误。

JSON 标准里属性名必须用双引号，字符串值也必须用双引号，这点很多人会绕进去。

遇到这种不规范格式，可以在 parse 之前先用正则把单引号替换成双引号，同时给属性名补上双引号。比较常见的写法是用 /(['"])?([a-zA-Z0-9_]+)(['"])?:/g 替换成 "$2": 。这个正则不是万能，遇到嵌套引号或者特殊字符还是会出问题，但应付简单的用户输入场景够用。替换完再 JSON.parse，就能正常拿到对象。

这里其实容易踩坑：正则处理过的字符串如果还有别的格式问题，parse 照样报错，所以 try/catch 还是不能省。

异常处理这块，JSON.parse 抛的是 SyntaxError。只要字符串不合法，它就会抛异常。常见做法就是用 try...catch 包住，catch 里面打印 e.message。比如漏了闭合引号的 JSON 字符串，parse 会直接抛错，不接住整个脚本就停了。接住之后至少能给个提示，或者走备用逻辑。

至于 JSON.stringify，它做的事相反，把 JavaScript 对象转成 JSON 字符串。

传一个对象进去，返回 {"name":"John","age":30,"city":"New York"} 这样的字符串。这个方法一般不会抛异常，不过它有自己的序列化规则，实际用的时候留意一下就行。

实际应用里，最典型的是用 fetch 拉接口数据。fetch 返回的 response 有个 json() 方法，内部会调用 JSON.parse 去解析响应体，所以 then 里拿到的 data 已经是对象了。如果返回内容不是合法 JSON，也会走到 catch，统一按获取数据异常处理。

还有一个场景是处理用户输入的 JSON。

比如表单里让用户粘贴一段 JSON 字符串，我们需要 JSON.parse 转成对象再校验字段。这种输入基本不可控，格式错误、多打少打个引号、属性名没引号，都很常见。所以 try/catch 是必须的，catch 里提示用户格式不对就行。预处理正则也可以在这里用，但最好还是引导用户填规范 JSON，少给自己找事。

反过来，把对象转成 JSON 字符串的场景也很常见。往 localStorage 存数据、传给后端接口、导出配置文件，都是先用 JSON.stringify 序列化。

这个操作本身比较简单，序列化出来的字符串可以直接传输或存储。

基本上把 JSON.parse 和 JSON.stringify 弄明白，日常开发里大部分 JSON 转换需求就覆盖了。parse 容易因为格式问题抛异常，需要 try/catch 接住；stringify 相对省心，但也要知道它的转换规则。异常处理做好，处理接口数据或者用户输入的时候就不会经常被 SyntaxError 打断。

域名分散、证书繁多？来此加密支持多域名合并至单张证书，通配符与IP证书通吃。自动化验证方案覆盖DNS代理、CNAME解析等，配合回调接口实现部署自动化，管理成本大幅降低。