Array forEach 迭代的 Eslint 错误：在预期返回 void 的函数参数中返回 Promise

【问题标题】：Eslint error with Array forEach iteration: Promise returned in function argument where a void return was expectedArray forEach 迭代的 Eslint 错误：在预期返回 void 的函数参数中返回 Promise
【发布时间】：2021-10-06 08:36:25
【问题描述】：

我正在尝试编写一个函数来对不抛出任何异常的文件进行转换，如下面的方法。我看到 ESLint 错误 - “Eslint：Promise 在函数参数中返回，其中预期返回 void。”。有什么办法可以修复这个 eslint？

请注意，我们会跳过会引发错误的文件。不过，这些都已适当记录。

export async function createDataFromFiles(inputFiles: File[]): Promise<Data[]> {
        const result: Data = [];
    
        inputFiles.forEach(
            async (file) => {
                const imageData = new DataView(await file.arrayBuffer());
                const blobUrl = URL.createObjectURL(new Blob([imageData]));
                try {
                    const dimension = await getDimensionsFromImageUrl(blobUrl);
                    answer.push({ imageData, dimension });
                } finally {
                    URL.revokeObjectURL(blobUrl);
                }
            }
        );
    
        return Promise.all(answer);
    }

【问题讨论】：

你可以使用普通的for ... of循环。

标签： javascript typescript eslint

【解决方案1】：

这是因为Array.forEach的签名：

forEach(callbackfn: (value: undefined, index: number, array: undefined[]) => void): void.

callbackFn 的类型为 void，但在使用 async 时，函数会隐式返回 Promise。

您可以通过使用普通的for...of 循环来避免此警告：

export async function createDataFromFiles(inputFiles: File[]): Promise<Data[]> {
    const result: Data = [];

    for (const file of inputFiles) {
        const imageData = new DataView(await file.arrayBuffer());
        const blobUrl = URL.createObjectURL(new Blob([imageData]));
        try {
            const dimension = await getDimensionsFromImageUrl(blobUrl);
            answer.push({ imageData, dimension });
        } finally {
            URL.revokeObjectURL(blobUrl);
        }
    }

    return Promise.all(answer);
}

【讨论】：