ES6 module：导出单个静态方法类或多个单独的方法

IT技术 javascript class module ecmascript-6
2021-01-14 04:34:40

我正在使用 ECMAScript6 module。从以下选项从module导出/导入多个方法的正确方法是什么？

单类静态方法：

//------ myClass.js ------

export default class myClass {

  static myMethod1() {
    console.log('foo'); 
  }

  static myMethod2(args...) {
    console.log('bar'); 
  }  

}

//------ app.js ------

import myClass from 'myClass';
myClass.myMethod1();    //foo

多种导出方法：

//------ myMethods.js ------

export function myMethod1() {
    console.log('foo');
}

export function myMethod2() {
    console.log('bar');
}

//------ app.js ------
import {myMethod1, myMethod2} from 'myMethods';
myMethod1()    //foo;


//OR
import * as myMethods from 'myMethods';
myMethods.myMethod1()    //foo;

1) 导出：一类只是静态方法感觉有点“代码味道”，但同样地，单独导出所有内容确实感觉有点冗长。是简单的开发人员偏好还是这里有性能影响？

2) 导入：'* as' 语法是我的首选方法，因为它允许您使用点符号（同时引用module和方法）帮助代码可读性。当我可能只使用其中一种方法时，这是否会影响性能？

2个回答

一类只是静态方法感觉有点“代码味道”

确实是的。你class在这里不需要结构！只需导出一个普通的“module”对象：

//------ myMethods.js ------

export default {
  myMethod1() {
    console.log('foo'); 
  },
  myMethod2(args...) {
    console.log('bar'); 
  }  
};

不过，我确实建议您使用多种导出的第二种方法。

单独导出所有内容确实感觉有点冗长

好吧，你不需要任何包装器结构，所以我会说它的样板文件更少。您只需要明确标记要导出的所有内容，这并不是一件坏事。

* as 语法是我的首选方法，因为它允许您使用点符号（同时引用module和方法）来提高代码可读性。

这在很大程度上取决于个人喜好，并且取决于您编写的代码类型。有时简洁性更好，但显式引用module的能力也很有帮助。请注意，使用命名空间导入* as和默认导入对象在这里非常相似，尽管只有命名导出允许您通过import {myMethod1, myMethod2}. 所以最好把选择权留给那些导入你的module的人。

这对性能有任何影响吗？

不多。无论如何，当前的 ES6 实现还没有针对性能优化。

一般来说，静态标识符比属性访问更容易解析和优化[1]，多个命名导出和部分导入理论上可以使 JIT 更快，当然，如果在捆绑期间删除未使用的导出，则较小的文件需要更少的时间来加载。有关详细信息，请参见此处。几乎不会有明显的性能差异，您应该使用更易于维护的。

[1]：module命名空间 ( import * as ns) 也是静态的，即使ns.…看起来像动态属性访问

@StevenT.Cramer 好吧，你总是可以做import { default as somethingcreative } from 'foo'/ import somethingcreative from 'foo'，命名导出不会改变任何事情。约定当然是将“foo”module导入为foo. 如果您的开发人员不想遵守该约定，那是他们的问题（或者他们有充分的理由这样做）。
2021-03-20 04:34:40
如果为了实例化类的实例而导出一个类，我会使用一个类。一个普通的{ ... }就是所需要的。
2021-03-25 04:34:40
@user5321531：是的，但是只有静态方法的类不需要实例化:-)
2021-03-29 04:34:40
@Rivenfall 你可以像 那样导入自己import * as namespace from './myself';，然后export { namespace as default }。但是我建议避免这种情况，只需让库的用户导入命名空间即可。
2021-04-03 04:34:40
能够执行 export default * （* 是一个包含所有命名导出的对象）会很好，但我想这违背了“不应该有不止一种方法来做到这一点”的理念
2021-04-10 04:34:40

TLDR；使用多种导出方法和显式导入。

@Bergi 关于不需要带有静态字段的类是正确的，在第一种情况下只需要一个对象。但是，Axel Rauschmayer不鼓励此选项：

请注意，默认导出对象通常是一种反模式（如果您想导出属性）。你失去了一些 ES6 module的好处（摇树和更快地访问导入）。

Airbnb 的开发人员推荐命名导出和显式通配符导入，请参阅此线程：https : //github.com/airbnb/javascript/issues/710#issuecomment-297840604

@MichaelFreidgeim 有很多方法可以提高可读性，而不会违反合理的约定。不破坏它们也可以节省大量的精神开销，除非您最喜欢的消遣是考虑摇树的成本效益。:)
2021-03-13 04:34:40
在许多情况下，可读性比摇树更重要
2021-04-07 04:34:40
其它你可能感兴趣的问题
上一篇跨浏览器 Javascript XML 解析 下一篇对对象数组中的相似键求和