首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

深入了解 Dynamic imports

深入了解动态导入

我们在前面的章节中提到的导出和导入语句被称为“静态”。语法非常简单和严格。

首先,我们不能动态地生成的任何参数。

模块路径必须是原语字符串,不能是函数调用。这不会工作:

其次,不能有条件地或在运行时导入:

这是因为的目的是为代码结构提供一个主干。这是一件好事,因为代码结构可以被分析,模块可以被收集并通过特殊工具绑定到一个文件中,未使用的导出可以被删除(“树状震荡”)。这是可能的,因为进口/出口的结构简单和固定。

但我们如何动态地、按需地导入模块呢?

import() 表达式

表达式加载模块并返回一个,该解析为一个包含其所有导出的对象。可以从代码中的任何地方调用它。

我们可以在代码的任何地方动态地使用它,例如:

或者,如果在异步函数中,也可以使用。

例如,如果我们有以下模块:

那么动态导入可以像这样:

或者,如果有默认的导出:

然后,为了访问它,我们可以使用模块对象的属性:

下面是完整的例子:

say.js

index.html

注意

动态导入可以在常规脚本中工作,它们不需要。

尽管看起来像一个函数调用,但它是一种特殊的语法,只是碰巧使用了圆括号(类似于`super()``)。

因此,我们不能将复制到一个变量,也不能使用。它不是一个函数。

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20210306A032TA00?refer=cp_1026
  • 腾讯「腾讯云开发者社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 cloudcommunity@tencent.com 删除。

扫码

添加站长 进交流群

领取专属 10元无门槛券

私享最新 技术干货

扫码加入开发者社群
领券