javascript - es6模块中导出对象的正确方法

Question

我正在尝试将我的模块导出为对象，但导出它似乎是“反模式”( https://medium.com/@rauschma/note-that-default-exporting-objects-is-usually-an-anti-pattern-if-you-want-to-export-the-cf674423ac38 )

所以我想知道导出对象然后将其用作

的正确方法是什么

从“./utils”导入实用程序`

utils.foo()

目前我就是这样做的

    /** a.js **/
    function foo(){
      //...
    }

    export {
      foo
    }

    /** b.js **/
    import * as utils from "a";

    utils.foo()

这样正确吗？我是否保留 tree-shaking 功能？

谢谢

Answer 1

如果您要导入/导出的对象仅包含一些函数(正如我所假设的，由于 Utils 名称)，您可以单独导出这些函数，如下所示:

export function doStuff1() {}
export function doStuff2() {}

像这样导入:

import {doStuff1, doStuff2} from "./myModule";

但是，如果要导出的对象除了方法之外还保存状态，则应坚持使用简单的导出默认 myObject。否则，调用导入的方法将无法按预期工作，因为对象的上下文会丢失。

作为示例，以下对象应作为整体导出，因为该对象的属性应保持封装状态。仅导入和调用 increment 函数不会改变 myObject，因为无法提供对象的上下文(因为它不是作为一个整体导入的)。

const myObject = {
    counter: 0,
    increment: function() {
        this.counter++;
    }
}
export default myObject;