JSON.parse() 必须用 try...catch 包裹以防 SyntaxError 中断执行;需检查 res.ok 并 await res.json() 才能捕获解析错误;避免空 catch 或正则校验等无效做法。

在 JavaScript 中,JSON.parse() 遇到非法 JSON 字符串时会直接抛出 SyntaxError,必须用 try...catch 包裹才能捕获,否则会中断执行。
基本写法:用 try catch 包住 JSON.parse
这是最常见也最必要的写法。只要不确定输入是否为合法 JSON(比如来自用户输入、接口响应、localStorage 读取),就必须加保护。
- 把
JSON.parse()放在try块里 - 在
catch中处理错误,比如打印提示、返回默认值或重试逻辑 - 不要忽略
catch中的错误对象,它包含有用的message和column信息
function safeParse(jsonStr) {
try {
return JSON.parse(jsonStr);
} catch (err) {
console.error('JSON 解析失败:', err.message);
return null; // 或返回 {}、[] 等默认值
}
}
safeParse('{"name": "Alice", "age":'); // SyntaxError,被 catch 捕获
区分不同错误类型(可选但推荐)
虽然 JSON.parse() 只抛 SyntaxError,但实际项目中可能和其他操作混在一起(比如网络请求 + 解析)。可以检查 err.name 来精准判断是否为解析错误。
-
err.name === 'SyntaxError'表示确实是 JSON 格式问题 - 其他错误(如
TypeError、NetworkError)可单独处理 - 避免把所有异常都当成 JSON 错误来兜底
try {
const data = JSON.parse(rawResponse);
render(data);
} catch (err) {
if (err.name === 'SyntaxError') {
alert('服务器返回了无效的数据格式');
} else {
alert('加载失败,请稍后重试');
}
}
配合 fetch 使用时注意响应体是否为 JSON
很多人以为 fetch().then(res => res.json()) 的错误也能被外层 try catch 捕获——其实不行,因为 res.json() 返回的是 Promise,拒绝时需用 .catch() 或 await 配合 try catch。
立即学习“Java免费学习笔记(深入)”;
- 用
await时,res.json()抛出的错误可被try catch捕获 - 用
.then().catch()时,要在.json()后链式调用.catch() - 还要先检查
res.ok,避免把 4xx/5xx 响应误当 JSON 解析
async function fetchUserData() {
try {
const res = await fetch('/api/user');
if (!res.ok) throw new Error(`HTTP ${res.status}`);
const data = await res.json(); // 这里可能 SyntaxError
return data;
} catch (err) {
if (err.name === 'SyntaxError') {
console.error('API 返回了非 JSON 内容');
}
throw err;
}
}
避免常见坑
有些看似合理实则无效的做法需要避开:
- 不加
try catch直接调用JSON.parse()—— 一旦出错脚本就停了 - 只检查字符串是否为空或
typeof是 string,不真正解析 —— 无法发现格式错误 - 用正则“简单校验” JSON —— 不可靠,JSON 规则复杂,正则容易漏判或误判
- 在
catch里静默吞掉错误(空catch{})—— 调试困难,问题难定位


















