TypeScript中如何简洁提取被拒Action Payload的错误信息？

方法1：可选链+空值合并（原生JS极简实现） #

直接利用ES6+的可选链操作符（?.）和空值合并运算符（??），一行代码按优先级提取错误信息，无需层层判断属性是否存在：

const errorMessage = payload.response?.data?.message ?? payload.stack ?? '未知错误';

• ?.会在访问不存在的属性时返回undefined，避免抛出类型错误
• ??会依次取第一个非undefined/null的值，完美适配多结构的payload场景

方法2：封装通用提取工具函数 #

如果需要在多个地方复用，或者要支持更多提取路径，可以封装一个轻量工具函数：

function extractErrorMessage(payload) {
  // 按优先级定义错误信息的提取路径
  const extractPaths = [
    ['response', 'data', 'message'],
    ['stack'],
    ['message'], // 可根据实际场景添加更多路径
    ['error', 'msg']
  ];

  for (const path of extractPaths) {
    let target = payload;
    let isValid = true;
    for (const key of path) {
      if (target == null || !(key in target)) {
        isValid = false;
        break;
      }
      target = target[key];
    }
    if (isValid && target) return target;
  }
  return '未知错误';
}

// 使用示例
const msg = extractErrorMessage(yourRejectedPayload);

这个函数可以灵活扩展提取路径，核心逻辑无需修改，比嵌套if判断更易维护。

方法3：借助Lodash的_.get（项目已引入Lodash时使用） #

如果项目已经依赖Lodash，_.get方法可以简化多层属性访问，结合空值合并同样能实现简洁提取：

const errorMessage = _.get(payload, 'response.data.message') ?? _.get(payload, 'stack') ?? '未知错误';

_.get会自动处理属性不存在的情况，返回undefined，用法和原生可选链类似，但兼容性更好（适合未升级到ES6+的项目）

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