html file
type="module"
<script src="Person.js" type="module"></script>
<script src="helpers.js" type="module"></script>
<script src="modules.js" type="module"></script>
Person.js
export class Person {
constructor(name) {
this.name = name;
}
sayHello() {
console.log(`Hi, this is ${this.name}`);
}
}
helpers.js
function algoExpert() {
console.log('AlgoExpert is the best!');
}
export function fronendExpert() {
console.log('fronendExpert is the best!');
}
module.js
import * as helpers from './helpers.js';
import * as person from './Person.js';
helpers.fronendExpert();
const conner = new person.Person('Conner');
conner.sayHello();
other way to import
import { fronendExpert, algoExpert } from './helpers.js';
import {Person} from './Person.js';
fronendExpert();
algoExpert();
const conner = new Person('Conner');
conner.sayHello();
use as for change
import { fronendExpert, algoExpert as algo } from './helpers.js';
import {Person} from './Person.js';
fronendExpert();
algo();
const conner = new Person('Conner');
conner.sayHello();
another way to export
function algoExpert() {
console.log('AlgoExpert is the best!');
}
function fronendExpert() {
console.log('fronendExpert is the best!');
}
export {algoExpert, fronendExpert};
export default
export default function algoExpert() {
console.log('AlgoExpert is the best!');
}
export function fronendExpert() {
console.log('fronendExpert is the best!');
}
import algoExpert, { fronendExpert } from './helpers.js';
import {Person} from './Person.js';
fronendExpert();
algoExpert();
const conner = new Person('Conner');
conner.sayHello();
other way ( use await keyword )
// we don't need this anymore
// import { fronendExpert } from './helpers.js';
const shouldSayFrontend = true;
if (shouldSayFrontend) {
const { fronendExpert } = await import('./helpers.js')
fronendExpert();
}
Top comments (0)