Importação dinâmica em JavaScript

No início do ano passado, foi proposto introduzir a importação dinâmica no JavaScript. Se alguém não souber, agora apenas a importação estática é suportada nativamente em JavaScript, e há razões para isso, mas este é um tópico para outra discussão. A proposta foi implementada e incluída na lista das próximas atualizações do ECMAScript. O Google Chrome com a versão 63 já suporta esse recurso. Vou lhe contar um pouco o que é e onde pode ser útil.


A importação dinâmica é usada da mesma maneira que a importação estática, mas possui várias diferenças principais:


A importação sintaticamente dinâmica é semelhante à chamada de função: import ('path / to / module.js');


O comando import ('path / to / file.js') retorna uma promessa, que entrará no estado cumprido depois que o próprio módulo for puxado e instalado diretamente, bem como todas as suas dependências. E isso significa que podemos escrever assim:


import('path/to/module.js') .then(module => { module.loadPageInto(main); }) .catch(err => { main.textContent = err.message; }); 

Ou mesmo assim:


 const module = await import('path/to/module.js'); 

Nota importante: embora a importação dinâmica seja sintática e pareça uma chamada para a função import (), ela não é uma função. Não é herdado de Function.prototype, o que significa que não pode ser chamado por chamada ou aplicação.


Existem muitos aplicativos para importação dinâmica, o require.js há muito tempo tem uma oportunidade semelhante e o webpack, se não me engano também, muitos de vocês provavelmente já usam essa funcionalidade há muito tempo. Agora será possível fazer isso nativamente. Mas, por outro lado, a capacidade de importar dinamicamente, dependendo das condições, durante o tempo de execução, também fornece um lugar para código mais confuso, embora eu entenda que você pode colocar um código incorreto com qualquer coisa, não é a ferramenta. Escreva sua opinião no comentário, o que você acha da importação dinâmica.


Você pode ler mais e ver aqui:
https://github.com/tc39/proposal-dynamic-import
https://developers.google.com/web/updates/2017/11/dynamic-import
https://www.youtube.com/watch?v=eg8eLH52d4s&t=31s

Source: https://habr.com/ru/post/pt455200/


All Articles