一、TypeError 类型错误1. Cannot read properties of undefined (reading xxx)报错含义读取undefined的属性后端返回字段缺失导致。产生场景后端接口漏返回字段、接口返回空数据、分页无数据。js运行// 错误代码 const res await fetch(/api/user).then(rr.json()) console.log(res.data.info.name) // res.data.info undefined修复可选链?.做空值保护js运行console.log(res?.data?.info?.name)2. Cannot read properties of null (reading xxx)报错含义变量为null访问其属性。场景后端数据库查询无数据返回null。js运行const user null // 数据库未查到用户 console.log(user.id)修复增加判空if(user user.id)3. xxx.map is not a function含义目标不是数组调用数组方法 map/filter/forEach场景后端接口本该返回数组实际返回null/对象/字符串js运行const list res.data.list // 后端返回 {} 而非 [] list.map(itemitem.name)修复先校验类型兜底空数组js运行const list Array.isArray(res.data.list) ? res.data.list : [] list.map(...)4. xxx.forEach is not a function同上数据非数组后端返回格式异常。5. xxx.push is not a function变量不是数组却执行push添加数据。6. Cannot set properties of undefined (setting xxx)给undefined赋值属性一般后端返回结构层级缺失。js运行let data data.id 1 // data 未初始化 undefined7. Function is not a constructor把普通函数当作构造函数 new 调用后端返回数据覆盖原有函数变量。8. xxx is not a function变量被后端返回数据覆盖原本是函数变成数字 / 对象 /undefined。9. Cannot convert undefined or null to objectObject.keys ()、Object.values () 传入 null/undefinedjs运行Object.keys(null)10. Assignment to constant variableconst 声明变量被重新赋值接口循环赋值覆盖常量。二、ReferenceError 引用未定义错误1. xxx is not defined原因变量未声明直接使用后端接口回调作用域丢失变量拼写错误userlist → userList。js运行function getInfo(){ const name 张三 } console.log(name) // name 函数局部变量外部无定义2. Cannot access xxx before initializationlet/const 变量在声明前访问暂时性死区异步回调顺序错乱。三、SyntaxError 语法解析错误接口返回字符串解析失败高频1. Unexpected token N in JSON at position x核心场景后端返回非标准 JSONJSON.parse 解析失败后端返回文本、HTML、错误提示、多余注释、中文未转义。js运行// 后端返回 success 而非 {code:200} JSON.parse(success) // 直接报错修复try/catch 包裹解析逻辑js运行function parseJson(str){ try{ return JSON.parse(str) }catch(e){ console.error(后端返回非JSON, str) return null } }2. Unexpected end of JSON input后端返回空字符串、截断不完整 JSON、接口超时返回空。3. Unexpected token } / { / ,JSON 格式不规范后端序列化对象存在多余逗号。4. Invalid or unexpected token字符串引号不匹配、后端返回特殊不可见字符、中文乱码。四、RangeError 数值 / 长度越界错误1. Invalid array length数组长度赋值负数、超大浮点数js运行new Array(-1) let arr [] arr.length -52. Maximum call stack size exceeded递归无终止条件、死循环后端大量循环处理数据。js运行function loop(){ loop() } loop()3. ToFixed() digits argument must be between 0 and 100数字.toFixed (200)参数超出 0~100 范围。五、网络请求后端接口原生报错Fetch/Axios1. Failed to fetch原因后端服务未启动、端口关闭接口地址拼写错误CORS 跨域拦截网络断开。2. Access to fetch at xxx from origin xxx has been blocked by CORS policy跨域报错后端未配置允许前端域名访问。3. 400 Bad Request请求参数格式错误后端校验不通过参数缺失、类型错误。4. 401 Unauthorized未登录、token 过期、token 未携带在请求头。5. 403 Forbidden登录成功但无接口访问权限。6. 404 Not Found后端接口路径不存在、路由地址写错。7. 405 Method Not Allowed请求方式不匹配后端只支持 POST前端用 GET。8. 500 Internal Server Error后端代码运行异常服务内部报错需查看后端日志。9. 502 Bad Gateway / 503 Service Unavailable后端服务宕机、网关失效、服务未启动。10. timeout of xxx ms exceeded接口请求超时后端处理慢、数据库查询卡顿。六、Promise /async/await 异步后台相关报错1. Uncaught (in promise) Error: xxxPromise 异常未写.catch()async/await 未套 try/catchjs运行// 错误 fetch(/api).then(res{ throw new Error(接口失败) }) // 正确 fetch(/api).then().catch(err{})2. await is only valid in async functions and the top level bodies of modulesawait 写在普通函数内未加 async。3. Promise resolver undefined is not a functionnew Promise 不传函数、传参错误。七、Node.js 后端专属报错服务端 JS1. Cannot find module xxx缺少依赖包、模块路径写错、未执行 npm install。2. ENOENT: no such file or directoryfs 读取文件文件 / 路径不存在后端读取配置、上传文件。3. EACCES: permission denied文件读写权限不足服务无操作文件权限。4. listen EADDRINUSE: address already in use端口被占用后端服务启动端口冲突。5. TypeError [ERR_INVALID_ARG_TYPE]: The path argument must be of type stringfs、path 工具传入 null/undefined 路径接口文件上传参数缺失。八、通用后台 Bug 排查标准流程复制完整报错堆栈定位报错行区分报错类型4xx/5xx → 网络 / 后端接口问题JSON parse → 后端返回数据格式异常xxx is not a function / Cannot read properties → 后端返回字段缺失、数据类型不符在 Network 面板查看后端原始返回值确认数据结构是否符合约定使用try/catch包裹接口请求与 JSON 解析增加类型校验、空值兜底规避后端数据不稳定引发的前端报错Node 服务端查看控制台日志定位数据库、文件、路由异常。
