I was looking at this code where a class instance is exported in a little bit weird way.

Providing a snipped. It is exported as follows:

    class RegisterStore {
    @observable success = false
    @observable failure = false
    @observable errors = {}
    ...
    }

export default new RegisterStore()
export { RegisterStore }

And it is imported as follows in index.js:

import registerStore from './stores/RegisterStore'
...
const stores = {
registerStore
...
}

Why are there two exports at the end of the first code? Is
export default new RegisterStore() AND
const NewRegisterStore = new RegisterStore(); export default NewRegisterStore are equivalent?

I was looking at this code where a class instance is exported in a little bit weird way.

Providing a snipped. It is exported as follows:

    class RegisterStore {
    @observable success = false
    @observable failure = false
    @observable errors = {}
    ...
    }

export default new RegisterStore()
export { RegisterStore }

And it is imported as follows in index.js:

import registerStore from './stores/RegisterStore'
...
const stores = {
registerStore
...
}

Why are there two exports at the end of the first code? Is
export default new RegisterStore() AND
const NewRegisterStore = new RegisterStore(); export default NewRegisterStore are equivalent?

• javascript
• reactjs
• singleton
• export

• Possible duplicate of Export multiple classes in ES6 modules – kockburn Commented Jan 26, 2019 at 12:54
• 1 No no... please don't mark it as a duplicate. That answer doesn't answer my question, please. – uneet7 Commented Jan 26, 2019 at 12:59
• 1 No, they're not the same export default new RegisterStore() export { RegisterStore }. One exports by default the instance, and the second exports the class inside an object. Which if I'm not wrong can be imported like so: import registerStore, {RegisterStore} from './stores/RegisterStore' – kockburn Commented Jan 26, 2019 at 13:10
• 1 export default const RegisterStore = new RegisterStore() will most likely give an error as that does not look like a valid export. But theoretically it's the same as export default new RegisterStore() – kockburn Commented Jan 26, 2019 at 13:14

1 Answer 1

No export default new RegisterStore() and export { RegisterStore } are not equal. In export { RegisterStore } you are exporting the class as a part of an export object while in export default new RegisterStore() you are exporting instance of class.

Further. export default new RegisterStore() should be enough to work fine. Exporting again line is useless until you dont want to import multiple variables from the same file. In that case it would be like:

export new RegisterStore();
export const anotherVariable = "TESTTEST";

and import like:

import {RegisterStore, anotherVariable} from './stores/RegisterStore';

Further to your last query: NO

export default new RegisterStore() AND 
export default const RegisterStore = new RegisterStore() are equivalent?

are not equivalent too.

Firstly export default const RegisterStore = new RegisterStore() throws error because RegisterStore is already declared as class and you are again declaring it with const.

Secondly:

export default const NewRegisterStore = new RegisterStore()

is also wrong because default exports have to be either exported as anonymous or the variables have to be declared first before exporting.

For your example it should be like:

let NewRegisterStore; export default NewRegisterStore = new RegisterStore();

So:

export default new RegisterStore() AND 

let NewRegisterStore; export default NewRegisterStore = new RegisterStore(); are equivalent

Please read more about "named export" and "export default" here