面试题：JavaScript 异步加载模块时如何处理错误

Question

在JavaScript进行异步模块加载（如使用动态导入）的过程中，可能会遇到各种错误，例如模块不存在、网络问题等。请详细阐述如何捕获和处理这些错误，并且给出一个完整的示例代码。

Answer 1

捕获和处理异步模块加载错误的方法

1. 使用try...catch：在async函数中，await表达式后的动态导入语句可以用try...catch块包裹来捕获错误。
2. .catch()方法：动态导入返回一个Promise，也可以使用.catch()方法来处理Promise被拒绝时的错误。

示例代码

// 使用try...catch
async function loadModuleWithTryCatch() {
    try {
        const module = await import('./nonexistentModule.js');
        console.log(module);
    } catch (error) {
        if (error.code === 'MODULE_NOT_FOUND') {
            console.error('模块不存在');
        } else if (error.message.includes('network')) {
            console.error('网络问题');
        } else {
            console.error('其他错误:', error);
        }
    }
}

// 使用.catch()方法
function loadModuleWithCatch() {
    import('./nonexistentModule.js')
      .then(module => console.log(module))
      .catch(error => {
            if (error.code === 'MODULE_NOT_FOUND') {
                console.error('模块不存在');
            } else if (error.message.includes('network')) {
                console.error('网络问题');
            } else {
                console.error('其他错误:', error);
            }
        });
}

// 调用函数
loadModuleWithTryCatch();
loadModuleWithCatch();

以上代码展示了两种捕获和处理异步模块加载错误的方式，在实际应用中可根据具体需求选择合适的方式。同时，对不同类型的错误进行了针对性处理，比如判断是模块不存在还是网络问题导致的错误。