Default Exports
There's one last itty-bitty piece of syntax that you'll encounter when working with modules: default exports.
Default exports are often used when you want to export a single value from a module. Let's take our math.js example one last time:
// math.js
export const add = (a, b) => a + b;
export const subtract = (a, b) => a - b;
// main.js
import { add, subtract } from "./math.js";
This exports two functions. Sometimes, a developer will want to just export one thing, so they can do this:
// math.js
export default const add = (a, b) => a + b; // the only thing exported
const subtract = (a, b) => a - b; // not exported
Then when it's imported, you don't need to use the curly braces:
// main.js
import add from "./math.js"; // no curly braces
You can even have default and named exports:
// math.js
export const subtract = (a, b) => a - b; // named export
const add = (a, b) => a + b;
export default add; // default export
Though you normally wouldn't do that...
Should I Use Default Exports?
Honestly... I kinda hate them. What if I want to export more things later? Now I have to refactor all of my imports and exports. It's a pain.
My personal preference is to just pretend default exports don't exist, and always use named exports.
Default exports are different from named exports because ____.