callback hell 重构为 Promise 时出现 TypeError 怎么回事？

把回调地狱重构为 Promise 时遇到 TypeError，通常是因为 `.then()` 接收了非函数参数，或者链式调用中缺少 `return` 导致后续步骤拿到 `undefined`，重点检查回调函数签名和 Promise 链的返回值。

先说结论：这类错误多半是语法迁移不彻底，旧回调写法与新 Promise 机制冲突所致，需逐一排查链式调用节点。

先确认：报错位置是否在 `.then()` 或 `.catch()` 内部，参数类型是否符合预期。
先处理：修正 `.then()` 接收的函数参数，确保每一步都正确 `return` 新的 Promise 或值。
再验证：运行代码观察控制台是否还有未捕获的 Promise 拒绝或类型错误。

典型报错堆栈分析

重构过程中最常见的 TypeError 报错信息如下，通常指向链式调用中的某一步返回值异常：

Uncaught (in promise) TypeError: Cannot read property 'length' of undefined
    at main.js:25
    at processTicksAndRejections (internal/process/task_queues.js:97:5)

或者：

callback hell 重构为 Promise 时出现 TypeError 怎么回事？

Uncaught (in promise) TypeError: nextStep is not a function
    at main.js:30

前者通常是因为上一步没有 return 数据，后者是因为 `.then()` 参数传入了非函数值。

实战案例：完整代码重构对比

以下模拟一个读取用户配置并处理数据的场景，展示从回调嵌套到 Promise 链的完整迁移过程。

重构前（回调地狱）

// 假设 getUser, getSettings, saveData 均为回调风格函数
getUser(userId, function(err, user) {
  if (err) return console.error(err);
  getSettings(user.id, function(err, settings) {
    if (err) return console.error(err);
    saveData(user, settings, function(err, result) {
      if (err) return console.error(err);
      console.log('Done:', result);
    });
  });
});

重构后（Promise 链）

// 包装为 Promise 或直接使用 Promise 化版本
getUserPromise(userId)
  .then((user) => {
    // 关键点 1：必须 return 下一个 Promise
    return getSettingsPromise(user.id); 
  })
  .then((settings) => {
    // 关键点 2：获取上一步返回值，不要沿用 (err, data) 签名
    return saveDataPromise(user, settings);
  })
  .then((result) => {
    console.log('Done:', result);
  })
  .catch((err) => {
    // 关键点 3：统一错误处理
    console.error('Operation failed:', err);
  });

分步排查与修复

检查 `.then()` 参数类型
确保传给 `.then()`、`.catch()` 的是函数。如果不小心传入了变量或未执行的调用结果，会直接报错。例如 `promise.then(nextFunc())` 是错的，应该是 `promise.then(nextFunc)` 或 `promise.then(() => nextFunc())`。
修正回调函数签名
将旧的 `(err, data) => {}` 改为 `(data) => {}`。在 Promise 链中，错误不再通过第一个参数传递，而是跳转到 `.catch()`。如果在 `.then()` 里继续写 `if (err) return`，逻辑可能会错乱。
补全 `return` 语句
在链式调用的每一步，如果后续依赖当前步骤的结果，必须 `return` 当前 Promise 或值。缺少 `return` 会导致链条断裂，后续 `.then()` 拿到 `undefined`。
统一错误处理
移除每个嵌套层里的 `if (err)` 判断，改用末尾统一的 `.catch(err => { ... })`。这能避免遗漏错误处理导致的未捕获拒绝。

验证方法

控制台无报错：运行重构后的代码，确认 Console 中没有 `Uncaught TypeError` 或 `Uncaught (in promise)` 红色报错。
链路完整：在最后一个 `.then()` 中打印最终结果，确认数据能顺利传递到底，中间没有变成 `undefined`。
异常捕获：故意制造一个错误（如读取不存在的文件），确认流程能跳转到 `.catch()` 块而不是中断程序。

常见坑

混用回调与 Promise：有些库同时支持回调和 Promise，如果传了回调函数又链式调用 `.then()`，可能导致执行两次或参数冲突。
同步错误未捕获：在 `.then()` 的回调函数内部如果发生同步代码错误（如访问 null 属性），需要依靠 `.catch()` 捕获，而不是 try-catch 包裹外部调用。
忘记处理拒绝状态：如果 Promise 被 reject 且没有 `.catch()`，在某些环境中会显示未捕获的 Promise 警告，虽然不一定是 TypeError，但会导致逻辑中断。

更多细节可参考 MDN Promise 官方文档。