ES6 模块:导出单个静态方法类或多个单独的方法 [英] ES6 modules: Export single class of static methods OR multiple individual methods

问题描述

我正在使用 ECMAScript6 模块.从下面的选项中从一个模块导出/导入多个方法的正确方法是什么?

I'm using ECMAScript6 modules. What is the correct way to export/import multiple methods from a module from the options below?

单类静态方法:

//------ 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) 导出:一类只是静态方法感觉有点代码味道"，但同样地，单独导出所有内容确实感觉有点冗长.是简单的开发者偏好还是这里有性能影响?

1) Exporting: A class of just static methods feels like a bit of a 'code smell' but similarly exporting everything individually does feel a bit verbose. Is it simply developer preference or are there performance implications here?

2) 导入:'* as' 语法是我的首选方法，因为它允许您使用点符号(同时引用模块和方法)来提高代码可读性.当我可能只使用其中一种方法时，这是否会影响性能?

2) Importing: '* as' syntax is my preferred method as it allows you to use the dot notation (referencing both the module AND the method) aiding code readability. Does this have performance implications though when I may only be using 1 of the methods?

推荐答案

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

A class of just static methods feels like a bit of a 'code smell'

确实如此.这里不需要 class 结构！只需导出一个普通的模块"对象:

Yes indeed. You don't need a class structure here! Just export a normal "module" object:

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

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

不过，我建议您使用第二种方法进行多次导出.

I do recommend your second approach with multiple exports, though.

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

exporting everything individually does feel a bit verbose

好吧，你不需要任何包装结构，所以我会说它的样板文件更少.你只需要明确地标记你想要导出的所有东西，这不是一件坏事.

Well, you don't need any wrapper structure, so I'd say it's less boilerplate. You just have to explicitly tag everything that you want to be exported, which is not a bad thing.

* as 语法是我的首选方法，因为它允许您使用点符号(同时引用模块和方法)来提高代码可读性.

* as syntax is my preferred method as it allows you to use the dot notation (referencing both the module AND the method) aiding code readability.

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

That's very much personal preference, and does depend on the type of code you are writing. Sometimes conciseness is superior, but the ability to explicitly reference the module can be helpful as well. Notice that namespace imports using * as and default-imported objects are very similar here, though only named exports allow you to directly reference them via import {myMethod1, myMethod2}. So better leave the choice to those that import your module.

这对性能有影响吗?

不多.无论如何，当前的 ES6 实现还没有以性能优化为目标.

Not much. Current ES6 implementations are not yet aiming for performance optimisations anyway.

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

In general, static identifiers are easier to resolve and optimise than property accesses^[1], multiple named exports and partial imports could theoretically make JIT faster, and of course smaller files need less time to load if unused exports are removed during bundling. See here for details. There hardly will be noticeable performance differences, you should use what is better maintainable.

_{[1]:模块命名空间(import * as ns)也是静态的，即使 ns.... 看起来像一个动态的属性访问子>}

_{[1]: module namespaces (import * as ns) are static as well, even if ns.… looks like a dynamic property access}

这篇关于ES6 模块:导出单个静态方法类或多个单独的方法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！