Transcrições
1. Introdução: Olá e bem-vindo aos módulos do
meu curso ES6, como usá-los e
como criá-los. Os módulos Es6 são o
novo padrão para carregar módulos em JavaScript, que é suportado em
todos os navegadores modernos. Ele tem uma nova sintaxe e palavras-chave
extras para
importação e exportação. Quase todos os
navegadores modernos podem usá-lo. Eles têm carregadores de
módulo integrados e também nenhum jazz em sua
versão mais recente o suporta. Então, todos os
transpiladores e empacotadores modernos e também
TypeScript o suportam. Novos projetos começando usam o novo
sistema de módulos e
mais e mais projetos existentes
são atualizados para apoiá-lo. E também ajuda a
agitar as árvores e minimizar
os tamanhos dos pacotes. Então, se você estiver usando módulos ES6, você está no
caminho certo para desenvolver aplicativos da web
modernos e
de fácil manutenção. Portanto, neste curso,
você aprenderá como usar as instruções Export e import
e como integrar módulos em sua página HTML, como usar importações dinâmicas
e como usar a sintaxe. Espero que você goste do curso e veja você no primeiro vídeo.
2. Importação e exportação: Olá e bem-vindo a este vídeo. Vou explicar neste vídeo
como usar os módulos ES6, como inseri-los, como criá-los e como
integrá-los ao seu HTML. Primeiro, vamos falar sobre o meu
ambiente de desenvolvimento em breve . Tenho vídeos para
recodificar como um IDE. Você também pode usar isso. É uma ótima ideia
da Microsoft. É grátis. Você pode
baixá-lo para minhas meninas, para Windows, para Linux. Mas você também pode
usar outra coisa. Você pode usar seu editor de
texto favorito, seja o que for. Realmente não importa. E eu estou usando um VGS
como um servidor surdo, que está transmitindo
código em tempo real. Mas você não precisa usá-lo. Você pode usar qualquer outra coisa. Você pode usar um servidor normal, você pode usar um webpack, servidor de
desenvolvimento, o que quiser. Então, vamos começar. E cada página da Web e cada aplicativo de representante
começa
em HTML, neste caso, index.html. E aqui está. É bem simples. Ele tem a guia título
VII porque estou usando criar VT para
criar um projeto. Então eu tenho essa div aqui, que contém apenas
pequenos textos. Então isso não importa. Mas aqui temos a primeira etiqueta
importante. É a tag de script, é claro ,
porque está
carregando um script. Nesse caso, é
o JS principal dos molhos, que está aqui. Nós verificamos agora mesmo. JS principal, no
momento está vazio, mas vou colocar
algum código lá. Então você também pode colocar algum código aqui dentro da tag de script e
, em seguida, omitir a fonte. Também é possível que
você já saiba que é uma tag de script normal. Funciona como uma tag de script
normal. A única diferença é que você
tem módulo de tipo aqui. E isso é
importante se você quiser
usar palavras-chave são declarações
como importar e exportar. No script, você precisa
usar o módulo de tipo aqui. Também há outra possibilidade. Faça importações dinâmicas. Você pode usar a função de importação e importar módulos, módulos ES6 com isso. Mas a maneira padrão de referenciá-los estaticamente é a tag de script e o módulo de tipo. Então isso é o
importante, digite módulo. E você pode escrever seu
código aqui dentro, ou você pode usar o
atributo source e apontar
para o seu JavaScript. Então, vamos verificar se isso
está realmente carregado. Então eu coloquei um ano algum log, apenas JS principal, e vamos
verificar a saída do console. Ok, então aqui está. Isso realmente funciona. Então nosso script, nosso
módulo, está carregado. E, no momento, não
é visível
que seja um módulo. Mas vamos colocar alguns
módulos de código específico aqui. Então, no momento em que
tivermos esse registro, podemos deixá-lo aqui. Mas o que é
importante no módulo? É que o módulo pode exportar algo ou você pode
importar algo ou ambos. Claro, estou fazendo
aqui a importação primeiro, é
claro, porque exportar
aqui não faz nenhum sentido. Porque estou carregando isso
por meio da tag de script aqui. E eu não posso usar
nenhuma exportação aqui. Então, temos que usar
primeiro alguma importação. Então, estou colocando uma declaração de
importação aqui. Essa é a novidade. Esta é a declaração de
importação do módulo ES6. E agora temos que
escrever algo para importar. E depois disso de
e você pode ler isso como importar algo que
especificamos mais tarde do arquivo, que é especificado aqui, que é eu criei o mod um. Então é mod one dot js. Use a extensão aqui. Eu também poderia omitir
a extensão aqui, mas isso é porque estou usando o
VHS como servidor surdo e ele pode resolver também os módulos
sem nenhuma extensão. Mas acho que é uma prática
recomendada colocar
a extensão aqui. Portanto, também pode ser
algo como JSX ou você também pode, se o seu ambiente suportar, você também pode usar, você também
pode importar CSS. Mas para isso você precisa de
algum tipo de empacotador, ou neste caso, as mortes do jazz também
suportam a importação de CSS. Mas normalmente você importa
um arquivo js dot js. Então, estamos
importando desse arquivo. E aqui precisamos
dizer ao mecanismo JavaScript o que importar. Podemos importar coisas diferentes. Podemos importar
exportações específicas, exportações únicas. Ou podemos importar um
padrão, uma exportação padrão, ou podemos importar o módulo
completo, que estou fazendo aqui
com este asterisco. E então eu preciso colocar algum identificador para
eles. Eu posso inventar isso completamente. Então, eu estou usando o mod one. Realmente não importa
qual é o identificador. Posso referenciar o módulo
com esse identificador. Então eu posso escrever aqui
mod one dot something. Está vazio no momento, então não tenho nada aqui. Então, eu estou apenas escrevendo o mod um. Mas o importante
aqui é o asterisco. Como mod one significa que estou importando o
módulo completo como um objeto, e estou nomeando-o mod um. Então esse é o meu identificador para o módulo, o módulo
completo. Vamos para o módulo mod one. No momento está
completamente vazio, então não há nada a
ser importado na verdade, mas colocamos algo aqui. Estamos importando algo. Portanto, devo exportar
algo neste módulo. E é aqui que
usamos a palavra-chave export. E depois da exportação, precisamos especificar o que
queremos exportar. E eu estou exportando
uma função aqui. E eu não posso, não posso exportar
e função anônima, devo nomeá-la aqui. Então, nós o nomeamos, fazemos porque ele está
apenas fazendo algo, algo como esse log do console. Estou apenas registrando. Faça isso. Ok, então aqui estamos exportando
essa função no JS principal. Posso importar isso e estou
inserindo o módulo completo. Então eu deveria ser capaz de fazer
algo como mod one dot, fazê-lo e chamá-lo aqui. Vamos verificar se está funcionando. Olá módulos, essa é a
nossa div, não importa. O importante está
aqui no console. Vamos fazer isso. Isso é o que nós,
o que registramos, na função export at para ele. E então temos js principais. Vamos verificar novamente o código. Sim, então estamos chamando a função de
exportação, faça isso. E nesta função estamos
fazendo o log do console. E depois disso, fazemos o log
do console JS principal. Então isso
já funcionou. Então está tudo bem. Vamos exportar a segunda função. Então, copiamos este e
o nomeamos, fazemos também. Nós trancamos no console. Ok, então o que devemos fazer aqui, o que devemos ser
capazes de fazer aqui é fazê-lo. Faça isso também a partir do módulo
mod one. E já está
sugerindo que eu faça também. E vamos ver se funciona. Faça isso, faça isso também. Funciona. Ok, então nós o exportamos
para funções aqui. Função de exportação, faça isso. A função de exportação devido à
sintaxe é direta. Você acabou de colocar a instrução
export antes da função aqui. E você também pode
exportar variáveis como liger, const, por exemplo. Isso é uma constante. Estou exportando isso aqui. Mod um ponto. Isso é uma constante. E eu posso apenas fazer login no
console aqui. E vamos verificar se está funcionando. Sim, então está saindo
para aqui. Então isso funciona. Podemos exportar funções, podemos exportar variáveis. Então, vamos ver se podemos importar uma função específica
ou exportação específica. Então, aqui também temos a sintaxe. Importe o módulo completo e faça referência a ele como este
identificador mod one. Eu poderia renomear o mod
um para apenas mod, por exemplo, posso
chamá-lo de qualquer coisa parecida. Mas agora, se eu quiser
importar uma exportação específica, preciso usar uma sintaxe diferente. A sintaxe aqui são
as chaves, que também são usadas
para estruturação e que são semelhantes. Então, estou colocando aqui
essas chaves encaracoladas e estou recebendo essas exportações aqui como sugestões para importação. Então eu tenho que fazer é, e isso é uma constante como as exportações deste módulo
mod one dot js. Vamos importar, faça isso. E estamos comentando
isso no momento. E agora eu importei fazer isso. Então eu preciso remover isso porque eu só tenho que fazer
isso agora como um identificador. E eu posso chamar de fazer isso como
uma função porque
é exportado aqui no mod um. E eu estou importando apenas esta, exportar, essa função aqui. E é chamado da mesma forma
que é exportado aqui, faça isso. E eu estou chamando isso. Então, vamos ver. Agora está funcionando. Eu poderia fazer o mesmo devido a uma atriz que todos os kowtow
também poderiam importar o const. Então, no momento, estou importando
completamente todas as
exportações aqui separadamente. Eu poderia chamar do it para
um log do console de ícones. Isso é uma constante. E devemos ter a
mesma saída de antes. É devido 22. Até agora tudo bem. Assim, podemos importar o módulo
completo. Você pode importar
exportações únicas ou importá-las separadamente
aqui, como eu fiz aqui. E se você quiser chamá-lo? Digamos que você
já tenha uma função
que é chamada para fazer isso. Você não quer
mudar o nome porque você quer usá-lo aqui. E este aqui está apenas
fazendo o log do console. E nós produziremos Local. Faça isso. Então agora temos um problema porque estamos definindo aqui essa
função, faça isso, e é o mesmo
identificador dessa importação. Mas como podemos importar isso e renomeá-lo para um identificador
diferente? Isso é possível com a mesma sintaxe que fizemos
antes com a estrela. Como fazer isso, como,
digamos, importado. Faça isso. Com essa sintaxe. Renomeamos a exportação para esse
identificador importado, faça isso. Vamos ver se podemos alterar
este para importá-lo, fazê-lo e ver qual é
a saída. Então, vamos fazer isso. Faça isso
com dois e cara local. Isso é o que esperávamos agora. Porque aqui, isso é,
claro, essa declaração de
função. Isso faz isso e os exportados
fazem isso a partir deste módulo. Nós o renomeamos
para importá-lo para ele. E você pode fazer o
mesmo ano, se quiser, fazer isso para importar. Então, se você já
tem e identifica no escopo do
seu módulo que é idêntico a uma
exportação de um módulo. Você pode usar essa sintaxe
para renomear a importação. Vamos verificar se
ainda está funcionando. Sim, está funcionando. Portanto, é assim que você importa
as exportações separadamente. E isso é importante porque
você também pode, é claro, importar tudo com sempre com uma estrela e um módulo
completo importante. Mas é um problema porque
você não diz ao empacotador ou ao programa que você usa para empacotar seu JavaScript e
minificado e coisas assim. Você não diz a este sistema o que você realmente usa
neste módulo. Se você faz isso e
só quer ter, digamos que você só
queria fazer isso. Então, eu estou comentando isso. Se você só quer ter, faça isso como importante para isso. O empacotador, se ele usa, por exemplo, é algo
como três tremores de árvore. O empacotador sabe
que você só usa, faça essa função
a partir deste módulo. Então, teoricamente, se
ninguém mais usa, nenhum outro
usuário do módulo faz isso também, ou essa constante, o empacotador
poderia simplesmente apagar esse código. E, portanto, diminua o tamanho do
pacote. Essa é a vantagem
dessa sintaxe:
basta importar uma única exportação. Portanto, você deve
preferir essa sintaxe. Você também pode, é claro, se
você usar o modular completo , quase
todas as funções ou as exportações no módulo. Você pode, é claro,
usar essa sintaxe. Então, mas se você, digamos que você tenha
algo como traço baixo, que contém cerca de 3030
exportações ou algo parecido. E você só precisa de uma função. Seria sensato
importar apenas essa função. Porque seu empacotador
apagaria todas as
outras funções. Você tem um tamanho de pacote muito
menor. Então, vou voltar a isso. Agora. Vamos pular direto para sintaxe
diferente ou um estilo de importação
diferente. Vamos chamá-lo assim. O que também podemos fazer é definir uma exportação padrão, padrão, exportação, padrão
após a exportação. E estou dizendo
ao sistema de módulos que essa é minha exportação padrão. Claro que sim. O que posso fazer aqui para importar a exportação
padrão? Então, digamos que essa seja
minha principal função aqui. É aqui que, digamos, 80%
dos usuários do módulo desejam usar. Ou talvez seja
também a única função. Vamos, vamos fazer assim. É a única função
que é a única exportação. Então você pode, você pode dizer que a função
padrão de exportação faz isso. E o que você pode fazer aqui é
escrever assim. Vamos mudá-lo para fazer isso. E eu vou apagar esse. Vamos verificar no
navegador se ele está funcionando. Faça isso. Funciona. Então, se você andar de exportação padrão, você pode importar esse padrão. Dessa forma. Basta escrever import,
depois qualquer identificação, eu poderia usar um identificador
diferente aqui que eu poderia usar importado. Faça isso. Não importa porque
essa sintaxe é para importar a exportação
padrão. Então eu posso nomeá-lo como eu quiser. Ainda trabalhando. Não precisa ser
o nome de exportação. Então eu poderia chamá-lo de qualquer coisa parecida porque
não estou especificando. Não preciso especificar o que
quero importar porque essa sintaxe é para
importar o padrão. É claro que você precisa ter um
padrão no outro módulo. Então, se eu apagar
isso, não deve mais funcionar, recebo um erro de sintaxe. O modelo solicitado não fornece
uma exportação chamada padrão. Ok? Então não funciona. Obviamente, tenho que
marcar a exportação como padrão
para importá-la como padrão. Então, aqui você pode colocar
alguns, qualquer identificação que
você gostaria de importar a exportação
padrão aqui. E eu posso ter uma segunda
exportação, que não é padrão. É claro que você só pode
ter um único padrão. Mas eu posso ter um segundo. Isso não é um problema. Então, como isso importa
eu, é claro que posso. Direito de importar declarações. O primeiro é
importar o padrão e o segundo é importar. Faça isso também. Isso é completamente possível. Então eu chamo aqui, faça também. E isso também deve funcionar. Acho que não mudei
o log do console aqui. Então agora faça isso e faça também. Ok, então é assim que você usa a importação com
uma exportação padrão. Você também pode, você
também pode combinar isso. Portanto, a sintaxe também é possível. Então, se você quiser importar
explicitamente nessas chaves, nessas chaves, você também pode dizer explicitamente, eu quero importar padrão, nomeie como importante fazê-lo. Você deve fornecer um
identificador, é claro, porque isso não funciona, porque você precisa de um
identificador aqui. Então você pode fazer isso. Então, assim que você colocar um
padrão antes da função, você precisará considerar
isso aqui e importá-lo como padrão e, em
seguida, algum identificador. Ou você pode, é claro, usar a expressão muito mais curta e importá-la assim. Claro que agora é o dobro. Então eu deveria comentar isso, ou eu apenas apago aquele. O padrão é importante para ele. Então, está tudo bem. Vamos verificar isso.
Ok, está funcionando. OK. Então é assim que você importa, e é assim que você exporta. E no próximo vídeo
falaremos sobre importação dinâmica, que é Sim, é apenas uma função que você pode usar
para importar módulos. E você pode usá-lo para atrasar o carregamento de
um módulo, por exemplo. Esse será o próximo vídeo
e espero ver você lá. Tchau.
3. Importação dinâmica: Olá, Bem-vindo a este vídeo. Aqui, explicaremos como
usar importações dinâmicas. Então, digamos que queremos
carregar um módulo, mas não no início do tempo de
carregamento sobre a página. Mas queremos carregá-lo mais tarde. Talvez em qualquer lugar do componente da interface do usuário, que é bastante grande,
tantas dependências. Portanto, não queremos
carregá-lo no início. No início
do carregamento da página. Queremos atrasar o
carregamento do módulo. Para um momento posterior. O usuário navega, por exemplo, para uma nova página. Neste momento,
o módulo será carregado e não no início. Podemos simular isso. Como não temos interação
do usuário aqui em nossa página da web no momento, podemos simular isso usando um setTimeout com o
atraso de 1 segundo. E aqui podemos
tentar carregar o módulo. Vamos ser ingênuos e tentar isso. Basta apagar isso aqui. Não precisamos mais disso. Basta colocar a instrução import
aqui nesta função. Então isso não funciona. Já está marcado como um erro. Tentamos mesmo assim. E veja o que o navegador diz. Erro de sintaxe não detectado,
inspecione token inesperado. Ok? Então esta é a mensagem de erro
que não é bem, não é bem explicativa,
mas vou explicá-la. Essa é a declaração de
importação estática. E estável significa que ele tem que
estar na parte superior do módulo. Então, deve estar aqui. E você também, normalmente, não tem permissão para
fazer isso, por exemplo. Então, está funcionando aqui. Mas acho que na
especificação, diz
que nada mais deve vir antes da primeira declaração
de entrada. Nada no meio. Portanto, você deve colocar
suas, todas as
suas entradas, suas importações estáticas
na parte superior do arquivo, na parte superior do módulo. Então, nós tentamos isso. Isso não funciona. Mas
há outra possibilidade. E é a função de importação,
a função de importação dinâmica, que também é chamada de Importação. E é uma função
que podemos chamá-la. E podemos fornecer parâmetros. E os parâmetros, é
claro, o de. Então, de onde obter
esse módulo. Então, pegamos o mesmo caminho, o mesmo módulo de uma importação estática e
verificamos qual é o resultado. Portanto, não há nada
impresso aqui. O que não é muito surpreendente, porque
não estamos fazendo nada aqui. Portanto, se esse módulo for carregado apenas, não
há código a
ser executado aqui. Somente as declarações de função
para fazer e fazer isso também. Então isso parece funcionar. Também podemos escrever um log
do console aqui para ver se ele está realmente carregado
e realmente executá-lo aqui. Depois de 1 segundo, mod um. Vamos recarregar a página. Após 1 segundo, vemos o mod
um impresso aqui. Ok, então isso parece funcionar. Mas tudo bem, então como obtemos nosso módulo ou as
exportações do módulo? Poderíamos tentar algo assim e colocar uma declaração de depurador aqui para verificá-la
no depurador. Ok, então está
parando aqui e
verificamos o que é retornado
da função de importação. Ok, este não é o
módulo, como podemos ver. É uma promessa, uma
suposta promessa. Se você não sabe
o que são promessas, eu vou explicar agora. Mas não é o que
esperávamos aqui. Pode-se pensar que, ok, tão importante é retornar o módulo, o módulo
importante. Mas não é. Em vez
disso, ele retorna uma promessa. E a promessa é algo
para tarefas assíncronas. Portanto, importar está carregando um
arquivo do servidor, que é naturalmente assíncrono. Então, ele precisa chegar
ao servidor. E o servidor precisa
enviar o código do módulo. E, em seguida, o mecanismo JavaScript
precisa executar o código. Então, isso é algo que
bloquearia o mecanismo JavaScript. isso que
é assíncrono. E para processos assíncronos, temos a API Promise. Se você não estiver familiarizado
com a API de promessa, podemos verificar o que é, quais são as propriedades
da promessa retornada. Já sugere
pegar finalmente, e então o
importante é feito aqui. Então é um método na promessa. E é preciso uma função. E também, essa
função tem um parâmetro. Nesse caso, é o módulo. Então eu deveria chamar isso de promessa. E então temos uma promessa e
temos o método então. E então o método recebe um, você pode chamá-lo de
métodos de retorno de chamada, função de retorno de chamada. E essa função de retorno de
chamada é chamada se a
promessa for resolvida. E, nesse caso, a
promessa é resolvida quando o módulo foi carregado. E o parâmetro da
função será o módulo. Podemos verificar isso
se colocar um depurador aqui e excluir este, podemos verificar o que é mod. E se minha suposição for verdadeira, basta recarregar a página
nafta 1 segundo. Estamos realmente chegando a esse depurador e
verificamos o módulo. E sim, isso
parece um módulo. Também é chamado de módulo aqui. E temos a exportação padrão aqui na propriedade padrão. E temos que fazer isso também. A função padrão
foi chamada para fazer isso, mas é, você pode
encontrá-la aqui no padrão. Portanto, o nome real não é usado como um nome de propriedade
por padrão é usado aqui. E a segunda exportação
foi fazer isso também, que é acessível
pelo mesmo nome. Então, com isso,
temos o módulo. Aqui, podemos
usá-lo. Vamos fazer isso. E sugestões já estão lá, padrão ou faça isso também. Então, usamos primeiro o padrão. E então podemos usar dois a dois e verificar o que
está impresso. Portanto, temos o mod um, que é impresso
no início do módulo, do módulo carregado. Então temos
que fazer e fazer também. Então é isso que
esperávamos e está funcionando. Essa não é uma sintaxe muito boa que você possa
escrevê-la de uma maneira melhor. E para isso, podemos
usar o
mecanismo async await ou a sintaxe
async await. Se você tiver uma promessa, um valor de retorno com uma promessa como você
fez com a importação. Você pode ligar ou escrever um peso. E isso significa que estamos esperando. Estamos aguardando a
resolução da promessa. Portanto, é o mesmo que aqui
nesta função de retorno de chamada. Exceto que não é
uma função de retorno de chamada, mas é um tipo de
código normal enquanto você o escreve. Em situações normais, situações
síncronas, as únicas diferenças
que temos nessa palavra-chave await. Então eu poderia escrever algo como constante mod igual ou
receber uma importação de peso. Então isso espera, espera pela
resolução da promessa. E o valor de retorno. Ou, nesse caso, o módulo será o
valor dessa expressão. E eu estou atribuindo isso ao mod. E então eu posso chamar
do it and default. E devido a, isso deve funcionar, exceto que
eu esqueci algo. E essa é a
palavra-chave async aqui. Portanto, se você estiver usando um peso, precisará usar async na função em que está
usando o peso. Esses dois vão juntos. Se você tiver um peso, use sempre assíncrono. Na frente da função. Exceto que você também pode
usá-lo no nível superior aqui. E então você não usa o async porque você
não tem uma função. Mas assim que você tiver
uma função,
teremos uma porque estamos
usando setTimeout. Você precisa usar
o async antes. Antes da função. Você também pode usar uma
função normal como essa. E antes da palavra-chave function, você precisa usar async ou antes a função de erro 40 seja uma sintaxe
mais curta para isso. E se você usar o async, você também pode usar o await. Await pode ser usado
em qualquer lugar onde você tenha um valor de retorno de uma
promessa ou tenha uma promessa. Assim, você pode aguardar a
resolução da promessa. Também há uma função
no navegador chamada fetch, e também está retornando
uma promessa e você também
pode usar await com isso. Por exemplo, será
algo assim. Aguarde e aqui você
colocaria o URL. Bem, na verdade, podemos usá-lo. Podemos conferir o mod one dot js. Podemos carregá-lo como texto. Então, vamos verificar qual será a
resposta. Isso não tem nada a
ver com módulos, mas de qualquer forma, tem algo a ver com
promessas e o peso. Então, estou mostrando
aqui a resposta. A resposta é um objeto de
resposta. Para obter os textos reais, precisamos chamar algo
no objeto de resposta. E esse texto. E isso também está retornando
uma promessa, como você pode ver. Então, já sabemos
como usar promessas. Então, eu estou assinando mais textos com um peso, respondo ao texto. O texto pontual também está
retornando uma promessa e estou aguardando a
resolução dessa promessa. E então eu vou pegar o texto do mod. Vamos verificar isso. Mais texto. Sim, e então temos nosso
texto de mod one dot js. Então, essa pequena
excursão por promessas, que temos que usar aqui. Então, ou você usa pontos
com a função de retorno de chamada. E essa
função de retorno de chamada é chamada sempre que a promessa
é resolvida. O que, neste caso, é quando
o módulo foi carregado. Ou você usa a
sintaxe muito mais agradável await import. E então você
pega diretamente a molécula. E então você pode usar o
módulo como se quisesse. Escreva um mod
de importação estática do dot mod one, JS que será o mesmo. Então, neste caso, o mod
seria o mesmo. Você pode chamar o padrão
ou fazer isso também. Então, podemos testá-lo aqui. Sim, então estou recarregando. Primeiro. É escrever, fazer isso, fazer também com a importação
estática
e, em seguida, fazê-lo e fazê-lo
também com uma importação dinâmica. Importação estática e,
aqui, importação dinâmica. Então, se você quiser carregar
um módulo bem a tempo, por exemplo, se o
usuário navegar para uma nova página e você quiser
renderizar um novo controle. Em seguida, você pode usar
a importação dinâmica. E isso retorna uma promessa. E você tem que esperar a promessa ou usar
os métodos dot then. E então você obtém o módulo. Assim como se você
usasse essa sintaxe.
4. Conclusão: Então, neste vídeo,
concluirei o curso e resumirei o que
mostrei sobre os módulos ES6. Vimos como
integrar módulos em HTML com uma
tag de script e um módulo de tipo. Então este foi o nosso primeiro
módulo aqui, js principal. Em seguida, importamos
o segundo módulo em nosso primeiro módulo
em nosso primeiro módulo. E esse é o segundo módulo. Nós exportamos
duas funções aqui. Uma é uma
exportação padrão e a outra não. E você viu como
importar o módulo inteiro, o módulo completo
com esse asterisco. Também vimos como
importar apenas exportações específicas. Então, por exemplo, aqui
importamos apenas dois. Ou também podemos importar
o padrão como fazê-lo. E, finalmente, vimos como usar a
função de entrada aqui, que é usada para
carregar módulos dinamicamente em tempo de execução. E aprendemos
como usar a
API de promessa e como usar as novas
palavras-chave, um único peso, para usar a função de importação
e obter imediatamente o módulo para que
possamos chamar as
funções exportadas aqui . Então, espero que você tenha
gostado do curso e espero que agora você possa usar os
módulos ES6 com sucesso. E com um pouco de confiança. à vontade para conferir
meus outros cursos sobre desenvolvimento web
e JavaScript. E boa sorte para
você e adeus.