如何让replaceAll的回调函数支持await异步调用？

问题根源 #

replaceAll是同步方法，不支持异步回调函数。你直接传入await myFunction的写法不仅错误（未传递匹配参数），而且异步函数返回的Promise会被直接转换成字符串[object Promise]，导致最终结果异常。

修正方案 #

手动拆分文本为匹配片段和非匹配片段，对每个匹配片段异步处理后再拼接结果：

window.onload = async () => {
    // 注意getElementById不需要加#前缀
    const elem = document.getElementById('myID');
    const originalContent = elem.innerHTML;
    // 替换为你的实际正则表达式，需加g全局标志
    const regex = /你的正则表达式/g;

    // 拆分文本为非匹配部分数组
    const nonMatchParts = originalContent.split(regex);
    // 获取所有匹配项
    const matches = [...originalContent.matchAll(regex)];
    const resultParts = [];

    // 交替拼接非匹配部分和处理后的匹配部分
    for (let i = 0; i < nonMatchParts.length; i++) {
        resultParts.push(nonMatchParts[i]);
        if (i < matches.length) {
            // 对匹配项执行异步处理
            const processedMatch = await myFunction(matches[i][0]);
            resultParts.push(processedMatch);
        }
    }

    // 更新元素内容
    elem.innerHTML = resultParts.join('');
};

const myFunction = async (matchedStr) => {
    // matchedStr是replaceAll原本会传入的匹配字符串
    // 假设number和value是你已定义的变量
    let amount = number * value;
    const amount_modified = await calculate(amount);
    return `${matchedStr} (${amount_modified})`;
};

额外修正点 #

1. 原代码中document.getElementById('#myID')错误，getElementById的参数是元素id的纯文本，不需要加#前缀；
2. 原代码elem.replaceAll(regex, await myFunction)逻辑错误：await myFunction会立即执行函数但未传参，且replaceAll需要的是回调函数而非Promise结果。

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