javascript - 导出模块对象并导入该模块的特定属性

Question

我正在编写一个 JS 模块，我想在其中导出一个与同一文件中声明的函数相关的对象。理想情况下，我只想导入导出对象的属性，而不是导入整个对象并解构它。有可能以某种方式实现吗？

模块.js

export const foo = {
   bar: () => console.log("foobar")
}

组件.js

import { bar } from './module.js'

bar();

当前的问题是该栏未被识别为函数。

Answer 1

I'm writing a JS Module, in which I want to export an object with reference to functions declared on the same file.

没有理由拥有该对象。这就是模块的用途。您导出的绑定(bind)成为模块对象的一部分(您永远不会直接引用它)，因此您无需显式创建该对象 - 这样做会有点妨碍，并阻止树-shaking(消除从未使用过的代码)。

Ideally, I would like to import only properties of the exported object, instead of importing the whole object and deconstructing it.

按照您当前的方法，这就是您必须做的，例如:

import { foo } from "./module.js";

然后要使用 bar，可以使用 foo.bar(); 或解构:

const { bar } = foo;
bar();

这是因为您导出的不是 bar，而是 foo，一个具有名为 bar 属性的对象。您的 import 应该会失败，因为没有名为 foo 的命名导出。 (但如果您使用 bundler ，它可能会掩盖该错误。)

但同样，不需要该对象。相反，只需这样做:

module.js:

export function bar() {
    console.log("foobar");
}

或

export const bar = () => {
    console.log("foobar");
};

然后您在 component.js 中的 import 就可以工作了。