Export in JavaScript

Eni Sinanaj
Jan 21 · 2 min read

What is export?

The export statement is used when creating JavaScript modules to export functions, objects, or primitive values from the module so they can be used by other programs with the import statement.

So basically it is used in a JavaScript files to make objects visible to other files (modules).

There are 3 types of exports

1 — Named exports (several per module)
2 — Default exports (one per module)
3 — Mixed named & default exports

Named exports

Named exports is when you need to make visible just a function or object leaving the rest of the file private.

example lib.js

this can be used in another file as follows:

main.js

As you can see a named export is then imported in the other script between curly brackets.

Note: In the above example lib.js is in the same directory as main.js. Otherwise if it is in another directory the path would have to be relative to the current folder.
Note also that the extension .js is omitted from the lib.js filename in the import, nonetheless it is referring to the file.

Say we have the following folder structure

in this case in main.js the import statement should be

I will explain in another article how to configure path aliases with babel.

Default exports

Default exports are much like the named exports. The different is that what is being exported is marked as default and there can be only one default export per module.

To illustrate with an example:

lib.js

Note: the function has no name and there’s the default keyword.
Now in main.js

The difference on this side of the module collaboration is that the imported module is not between curly brackets and you can call it as you please.

Mixed exports

Mixed exports is nothing more than the use of both methods shown above in a single script.

Just a quick example:

lib.js

in main.js we would import this functions as follows:

One more thing, there can be more named imports from one module and just one default.

This is correct

This is wrong

Eni Sinanaj

Written by

#dev #mobiledev #startup #entrepreneur #business #money #excess #earth #motivational #speaker #hype #manager #startup #consulting

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade