如何将 Promise 数组（原始 File 数组）转换为字符串值数组？

Question

简而言之，我有一个函数可以将

File

类型值转换为

base64

string

类型值（如 How to conversion file to base64 in JavaScript? 所建议）：

export const customConvertFileToBase64String = (file: File) =>
  new Promise<string | ArrayBuffer | null>((resolve, reject) => {
    let reader = new FileReader();
    reader.readAsDataURL(file);

    reader.onload = () => resolve(reader.result);
    reader.onerror = reject;
  });

但是，当我使用带有

File

类型值数组的函数时，它返回

Promise<string | ArrayBuffer | null>[]

:

const getFullValue = (files: File[]) => files.map(async (file) => 
  await customConvertFileToBase64String(file));

我尝试了下面的方法将其转换为

(string | ArrayBuffer | null)[]

，带着这个问题 - 如何从 Promise 中提取数据（不太熟悉

Promise

类型）：

// REMARK: not working for both map() and forEach() function
const getFullValue = (files: File[]) => files.map(async (file) => 
  await customConvertFileToBase64String(file)).map(async (promise) => 
    await promise.then((result) => result));

Answer 1

问题是，当你在数组中使用

map

并且回调是

async

时，你得到的结果是一个

Promise

数组。所以

getFullValue

返回

Promise<string | ArrayBuffer | null>[]

:

const getFullValue = (files: File[]) => files.map(async (file) => 
  await customConvertFileToBase64String(file));

您可以使用

Promise.all

等待所有承诺完成。您将得到

(string | ArrayBuffer | null)[]

（无承诺）结果：

const getFullValue = async (files: File[]) => await Promise.all(files.map(async (file) => 
  await customConvertFileToBase64String(file)));

getFullValue.then(result => {
  // result is (string | ArrayBuffer | null)[]
})