【问题标题】:How to import one function from various files in same folder in Javascript?如何从Javascript中同一文件夹中的各种文件中导入一个函数?
【发布时间】:2021-01-25 20:13:48
【问题描述】:

我有多个函数分布在同一个文件夹中的七个 javascript 文件中。我想将它们导入另一个文件,而不必一个接一个地导出。为简单起见,假设我在每个文件中只有一个函数,然后我将使用默认导出。所以“脚本”中的 .forEach 文件,我可以这样做:

export default myFunc1 // first.js
export default myFunc2 // second.js
export default myFunc3 // third.js
...

然后,在我要导入的文件中:

import myFunc1 from "./scripts/first.js"
import myFunc2 from "./scripts/second.js"
import myFunc3 from "./scripts/third.js"
...

但是我想知道是否有更简单的方法来执行此操作,因为“export * from /scripts”之类的变体在这种情况下似乎不起作用。

【问题讨论】:

  • 我不这么认为。像这样的显式硬编码依赖项使代码更易于管理,您当前的代码对我来说看起来不错。
  • 它确实看起来不错,除非我有 20 多行从每个文件中导出一个函数。我很高兴这不是我的情况。

标签: javascript import export


【解决方案1】:

您可以在与您要导入的所有 Javascript 文件相同的目录中添加一个 index.js 文件。然后,将所有函数导入到这个index.js 文件中。这样,您就不必在任何使用它们的地方列出每一个函数(或其文件)。

export default myFunc1 // first.js
export default myFunc2 // second.js
export default myFunc3 // third.js
...

index.js 文件将是

import myFunc1 from "./scripts/first.js"
import myFunc2 from "./scripts/second.js"
import myFunc3 from "./scripts/third.js"
...
export {
myFunc1,
myFunc2,
myFunc3,
...
};

假设这些函数文件和 index.js 文件位于名为 functions 的目录中,并且您希望从更高一级的文件中访问它们:

import "./functions"; // Or "functions"

现在,请记住,仅当您在多个地方使用这些功能时才需要此解决方案。如果你不是,你可以使用你原来的方法。

【讨论】:

  • 谢谢!导入到另一个文件然后从中导出的想法非常聪明。我想我自己无法弄清楚,哈哈。
  • 说实话,这种方法在大型应用中被广泛使用。
猜你喜欢
  • 2012-08-27
  • 1970-01-01
  • 2016-04-12
  • 2019-09-25
  • 1970-01-01
  • 2017-10-07
  • 2020-10-16
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多