ES6 modules: Export single class of static methods OR multiple individual methods

by

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

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 syntax is my preferred method as it allows you to use the dot notation (referencing both the module AND the method) aiding code readability.

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.

Does this have any performance implications?

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

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]: module namespaces (import * as ns) are static as well, even if ns.… looks like a dynamic property access

More Related Contents:

  1. Private properties in JavaScript ES6 classes
  2. Pass options to ES6 module imports
  3. ES6 class variable alternatives
  4. Node.js plans to support import/export ES6 (ECMAScript 2015) modules
  5. Call static methods from regular ES6 class methods
  6. How can I conditionally import an ES6 module?
  7. How to extend a class without having to use super in ES6?
  8. Declaring static constants in ES6 classes?
  9. Create an instance of a class in ES6 with a dynamic name? [duplicate]
  10. ES6 modules in the browser: Uncaught SyntaxError: Unexpected token import
  11. ES6 classes : what about instrospection?
  12. Javascript ES6 class definition not accessible in window global
  13. How to use code from script with type=module [duplicate]
  14. “This” within es6 class method [duplicate]
  15. ES6 Dynamic class names
  16. Importing modules using ES6 syntax and dynamic path [duplicate]
  17. Is there any one-line analogy in ES6 for ES5 `module.exports = require(‘./inner.js’)`?
  18. Override a setter, and the getter must also be overridden
  19. Getting a list of statics on an ES6 class
  20. How to import part of object in ES6 modules
  21. `if __name__ == ‘__main__’` equivalent in javascript es6 modules
  22. Web Workers – How To Import Modules
  23. ES6+ javascript module export options
  24. Export multiple classes in ES6 modules
  25. What are getters and setters for in ECMAScript 6 classes?
  26. Why aren’t methods of an object created with class bound to it in ES6?
  27. ES6 module scope
  28. How to add mixins to ES6 javascript classes?
  29. ES6 – declare a prototype method on a class with an import statement
  30. How should I import the Spatial Illusions milsymbol library into my webpage?

Leave a Comment