Differences between creating a new class to using export const

by

Would there be a new instance every time I import A?

No, modules are only evaluated once.

Is one of the benefits of B the ability to use object destructuring and then use method1 as if it existed locally?

Yes, though it’s not called “destructuring”. They’re named imports (or named exports of the module), and they don’t nest and use a different syntax for aliasing.

Is one of the benefits of A the ability to initialize state in the constructor?

No. You can initialise module state just directly in the module scope as well, you don’t need a constructor function for that.

But yes, if you have state in the instances, it’s a good idea to use a class which you can instantiate multiple times. For that, you need to export the class itself, not an instance, of course.

Is the export default new … pattern valid at all?

No, it’s an antipattern for the reasons outlined above. Given the class is used nowhere else, it’s quite similar to the anonymous class antipattern. And exporting multiple named exports is much better than default-exporting objects anyway.

More Related Contents:

  1. Unable to access React instance (this) inside event handler [duplicate]
  2. Uncaught TypeError: Cannot read property ‘state or props’ of undefined
  3. What’s the difference between “super()” and “super(props)” in React when using es6 classes?
  4. Dynamically import images from a directory using webpack
  5. Programmatically navigate using react router V4
  6. Babel 6 changes how it exports default
  7. ReactJS giving error Uncaught TypeError: Super expression must either be null or a function, not undefined
  8. Support for the experimental syntax ‘classProperties’ isn’t currently enabled
  9. How to resolve “Cannot use import statement outside a module” in jest
  10. Unexpected token ‘=’ in React Component [duplicate]
  11. mobx-react observer don’t fires when I set observable
  12. How to import and export components using React + ES6 + webpack?
  13. In React ES6, why does the input field lose focus after typing a character?
  14. Remove console.logs with Webpack & Uglify
  15. Updating React state when state is an array of objects
  16. Unable to use Arrow functions inside React component class [duplicate]
  17. How to tell webpack dev server to serve index.html for any route
  18. Requires Babel “7.0.0-0” but was loaded with “6.26.3”
  19. Unexpected block statement surrounding arrow body
  20. ReactJS with ES6: this.props is not a function when I communicate two components
  21. Value of “this” is incorrect when debugging Babel transpiled React with Chrome Devtools
  22. React: Which is recommended arrow or normal function?
  23. How to resolve “Cannot use import statement outside a module” from Jest when running tests?
  24. Difference between import React and import { Component } syntax [duplicate]
  25. How to assign the correct typing to React.cloneElement when giving properties to children?
  26. What is the expected return of `useEffect` used for?
  27. Property ‘value’ does not exist on type ‘never’. when use useRef hook in mui
  28. import a module from node_modules with babel but failed
  29. Exporting functions with reactjs and babel
  30. Put A Warning If Page Refresh in ReactJS

Leave a Comment