Default exports vs named exports in Typescript - Quick Revision & Key Differences

Recall & Review

beginner

What is a default export in TypeScript?

A default export is a single value or entity that a module exports as its main thing. When importing, you can name it anything you want.

beginner

How do you import a default export?

You import a default export using the syntax: <code>import anyName from './module'</code>. The name can be anything you choose.

beginner

What are named exports?

Named exports allow a module to export multiple values by name. When importing, you must use the exact exported names inside curly braces.

beginner

How do you import named exports?

You import named exports using the syntax: <code>import { name1, name2 } from './module'</code>. The names must match exactly.

intermediate

Can a module have both default and named exports?

Yes, a module can have one default export and multiple named exports at the same time.

Which syntax imports a default export from a module?

A import * as myThing from './module'

B import { myThing } from './module'

C export default myThing

D import myThing from './module'

Default exports are imported without curly braces using any name you choose.

How do you import a named export called 'foo'?

A import { foo } from './module'

B import foo from './module'

C import * as foo from './module'

D export default foo

Named exports must be imported using curly braces with the exact exported name.

Can you rename a default import when importing?

A Yes, you can name it anything you want

B No, you must use the original name

C Only if you use 'as' keyword

D Only if the module exports multiple defaults

Default imports can be named anything during import.

Which statement is true about named exports?

A You can only have one named export per module

B Named exports must be imported with the exact exported names

C Named exports are imported without curly braces

D Named exports cannot be combined with default exports

Named exports require exact names and curly braces when importing.

Is this valid? export default function() {} and export const foo = 5; in the same file?

A No, you cannot mix default and named exports

B Only if you use 'export * from' syntax

C Yes, you can have one default and multiple named exports

D Only if you rename the default export

Modules can have one default export and many named exports together.

Explain the difference between default exports and named exports in TypeScript.

Think about how you import and name things from a module.

Describe how you would import both a default export and named exports from the same module.

Remember the syntax differences for default and named imports.