Импорти динамикии модулҳои 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 чоп кунед.