动态导入(import())返回 Promise,可直接用 await、.then() 或 Promise 静态方法处理;默认导出为 default 属性,具名导出需解构或点语法访问;必须捕获错误;支持超时、降级、竞速等高级控制。

动态导入(import())在 JavaScript 中返回一个 Promise,所以天然适合用 Promise 的方式处理异步结果。你不需要额外封装,直接用 .then()、await 或 Promise 组合方法就能拿到模块导出内容。
用 await 获取模块导出
这是最直观的方式,适合在 async 函数中使用:
注意:顶层 await 在模块作用域中可用(ES2022+),但需确保运行环境支持
- 模块默认导出会作为
default属性存在 - 具名导出需通过解构或点语法访问
例如:
在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。
立即学习“Java免费学习笔记(深入)”;
async function loadUtils() {
const utils = await import('./utils.js');
console.log(utils.default); // 默认导出
console.log(utils.capitalize); // 具名导出(如果有的话)
}
用 .then() 链式处理
适用于不支持 top-level await 的环境,或需要与其他 Promise 并行/串联时:
- 返回的 Promise resolve 值是一个模块命名空间对象
- 可配合
Promse.all()同时加载多个模块
例如:
立即学习“Java免费学习笔记(深入)”;
import('./math.js')
.then(math => math.add(2, 3))
.then(result => console.log(result));
错误处理不能少
动态导入失败会 reject,必须捕获,否则会触发 unhandledrejection:
- 用
try/catch配合await - 或用
.catch()处理.then()链中的错误
例如:
立即学习“Java免费学习笔记(深入)”;
async function loadModule() {
try {
const mod = await import('./feature.js');
mod.init();
} catch (err) {
console.error('模块加载失败:', err.message);
}
}
结合 Promise 静态方法做高级控制
比如按需加载 + 超时控制、降级逻辑、竞速加载:
- 用
Promse.race()实现超时中断 - 用
Promise.allSettled()容错加载多个可选模块 - 用
Promise.any()加载首个成功的模块(如多 CDN 备份)
例如超时控制:
function timeout(ms, promise) {
return Promise.race([
promise,
new Promise((_, reject) =>
setTimeout(() => reject(new Error('加载超时')), ms)
)
]);
}
timeout(5000, import('./heavy-module.js'))
.then(m => m.render())
.catch(err => console.warn(err.message));

















