Default vs Named Exports
Default Vs Named
π¨βπΌ There are two ways to export from modules: named exports and default
exports. Let's understand when to use each.
// utils.ts
export function formatDistance(meters: number) {
return `${meters}m`
}
export function formatDuration(seconds: number) {
return `${seconds}s`
}
export default class UnitFormatter {
formatDistance(meters: number) {
return formatDistance(meters)
}
}
π¨ Open
and
and:
- In
utils.ts:- Export
formatCurrencyandformatDateas named exports - Export the
Formatterclass as the default export
- Export
- In
index.ts:- Import the named helpers and the default
Formatter - Re-export
formatCurrency,formatDate, andFormatter
- Import the named helpers and the default
Observable values from the provided implementations:
formatCurrency(99.99)β'$99.99'formatDate(new Date(2024, 0, 15, 12, 0, 0))matches1/15/2024new Formatter()exposes the same formatting methods
π MDN - Export


