Javascript modules: Difference between revisions
From wikinotes
| Line 40: | Line 40: | ||
== Imports == | == Imports == | ||
<blockquote> | <blockquote> | ||
<syntaxhighlight lang=" | <syntaxhighlight lang="javascript"> | ||
import * as Foo from './modules/foo.js' // exported symbols accessed on 'Foo' namespace | import * as Foo from './modules/foo.js' // exported symbols accessed on 'Foo' namespace | ||
import { Bar, Baz } from './modules/foo.js' // import exported 'Bar', 'Baz' into current namespace | import { Bar, Baz } from './modules/foo.js' // import exported 'Bar', 'Baz' into current namespace | ||
Revision as of 15:58, 18 December 2022
In recent years, javascript has been extended to support modules.
Documentation
MDN modules https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules
Example
<!-- index.html --> <html lang="en"> <head> <script type="module" src="main.js"></script> <!-- add main.js to file --> </head> </html>// main.js import * as Math from './modules/math.js' console.log(Math.sum(1, 2));// modules/math.js export function sum(a, b) { return a + b; }
Syntax
Imports
import * as Foo from './modules/foo.js' // exported symbols accessed on 'Foo' namespace import { Bar, Baz } from './modules/foo.js' // import exported 'Bar', 'Baz' into current namespace import { Bar as barbar } from './modules/foo.js' // import exported 'Bar' as symbol 'barbar' within current namespaceExports
export { foo, bar, baz }; export * from 'foo.js' export { name } from 'foo.js'
Exporting Symbols
Exporting Default
// ${project}/modules/math.js export default function sum(a, b) { return a + b; }import * as Math from './modules/math.js' Math.default(1, 1) // -> 2 ('default' is the 'sum' function)
