如何让向filter传入异步函数触发TypeScript编译时错误？

你遇到的这个问题非常典型：异步函数作为Array.filter的回调时，返回的是Promise<boolean>而非原始的boolean，而JavaScript中所有Promise对象在布尔判断里都会被视为真值，导致过滤完全失效。至于TypeScript没在编译时拦住这个问题，大概率是你的编译配置不够严格，或者缺少针对性的Lint规则。下面分两种方案解决：

一、调整TypeScript编译配置，开启严格类型检查 #

TypeScript默认的宽松配置不会强制检查函数返回值的精确类型，但只要开启严格模式相关选项，就能在编译时捕获这个错误：

• 推荐方案：开启全严格模式
  在你的tsconfig.json中设置：

  {
    "compilerOptions": {
      "strict": true
    }
  }
  

  这个选项会开启所有严格类型检查规则，其中strictFunctionTypes会强制校验函数的参数和返回值类型是否完全匹配——此时TypeScript会直接报错，提示你(file: YourFileType) => Promise<boolean>无法赋值给Array.filter要求的(value: YourFileType) => boolean类型。

• 最小化配置：仅开启关键规则
  如果不想启用全严格模式，至少开启以下两个选项：

  {
    "compilerOptions": {
      "strictFunctionTypes": true,
      "noImplicitReturns": true
    }
  }
  

  strictFunctionTypes负责严格校验函数类型匹配，noImplicitReturns确保函数不会意外返回非预期类型的值。

二、使用ESLint+@typescript-eslint插件检测误用的Promise #

TSLint已经被官方废弃，现在推荐使用ESLint配合@typescript-eslint插件，其中的no-misused-promises规则专门检测Promise被误用在布尔上下文的场景（比如filter回调、if条件判断等）。

配置步骤： #

1. 安装依赖包：

   npm install eslint @typescript-eslint/eslint-plugin @typescript-eslint/parser --save-dev
   

2. 在项目根目录创建.eslintrc.json，添加规则配置：

   {
     "parser": "@typescript-eslint/parser",
     "plugins": ["@typescript-eslint"],
     "rules": {
       "@typescript-eslint/no-misused-promises": ["error", {
         "checksConditionals": true,
         "checksVoidReturn": true
       }]
     }
   }
   

   这个规则会在你把异步函数作为filter回调时直接抛出错误，明确提示你Promise不能被当作布尔值使用。

补充：异步过滤的正确写法 #

既然Array.filter不支持异步回调，正确的异步过滤方式应该先批量获取所有判断结果，再同步过滤：

// 先批量执行异步判断
const isDirectoryResults = await Promise.all(files.map(file => isDirectory(file)));
// 根据结果过滤原数组
const filteredDirectories = files.filter((_, index) => isDirectoryResults[index]);

或者使用reduce结合异步操作来实现更高效的过滤（避免遍历两次数组）：

const filteredDirectories = await files.reduce(async (accPromise, file) => {
  const acc = await accPromise;
  if (await isDirectory(file)) {
    acc.push(file);
  }
  return acc;
}, Promise.resolve([] as YourFileType[]));

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