ES модульдерін JavaScript-те динамикалық импорттау
ES модульдерін динамикалық түрде импорттауға болады. Бұл мүмкіндік кейде пайдалы болып табылады. Бұл қалай жасалатынын қарастырайық. Бізде келесі модуль бар делік:
export function func1() {
return '1'
}
export function func2() {
return '2'
}
export default function() {
return 'text';
};
Бұл модульді бірден емес, белгілі бір оқиға бойынша, мысалы, түймешені басқан кезде импорттағымыз келеді делік:
btn.addEventListener('click', function() {
});
import командасы арқылы модульді импорттайық:
btn.addEventListener('click', function() {
import('./test.js');
});
import командасы нәтиже ретінде
промис қайтарады:
btn.addEventListener('click', function() {
import('./test.js').then(mod => {
});
});
Коллбэк айнымалысына экспортталған функциялары бар объект түседі:
btn.addEventListener('click', function() {
import('./test.js').then(mod => {
let res1 = mod.func1();
let res2 = mod.func2();
console.log(res1, res2);
});
});
Әдепкі бойынша экспортталатын нәрсе
default кілтінде болады:
btn.addEventListener('click', function() {
import('./test.js').then(mod => {
let dfn = mod.default;
console.log(dfn);
});
});
Импорттау кезінде деструктуризацияны орындауға болады:
btn.addEventListener('click', function() {
import('./test.js').then(({func1, func2}) => {
let res1 = func1();
let res2 = func2();
console.log(res1, res2);
});
});
Апта күндерінің атауларының массивін экспорттайтын модуль жасаңыз.
Түймешені басқан кезде осы модульді импорттап,
апта күндерін ul тізімі түрінде шығарыңыз.