Análise aprofundada do mecanismo de execução de eventos em JS

Como começar rapidamente com o VUE3.0:

Fiquei um pouco confuso quando comecei a estudar uma questão de teste escrito há algum tempo. Hoje analisaremos minuciosamente o mecanismo de execução de eventos do JS.

Vejamos primeiro um trecho de código

. Amigos, vocês podem tentar escrever a ordem de impressão.

de thread único

JS usado principalmente como linguagem de script do navegador. O objetivo principal de Js é operar o DOM, que determina que JS deve ser de thread único se JS for multithread como Java e se dois threads operarem. o DOM ao mesmo tempo, então o navegador deve Como implementá-lo?

O lançamento do JS é, na verdade, para aproveitar a popularidade do Java. A linguagem foi escrita há pouco tempo, então é por isso que JS é

um mecanismo de execução JS

Como JS é de thread único, as tarefas devem ser classificadas. Todas as tarefas serão executadas de acordo com uma regra.

• Tarefas síncronas

• Tarefas assíncronas

Tarefas síncronas e tarefas assíncronas entram na pilha de execução. JS determinará primeiro que o tipo da tarefa

• é uma tarefa síncrona. Se entrar diretamente no thread principal,

• é uma tarefa assíncrona. Insira Event Table e registre a função de retorno de Event Queue Depois

• que todas as tarefas síncronas forem executadas, JS entrará Event Queue . A função de leitura

• executa esse processo repetidamente até que todas as tarefas sejam concluídas. É assim que costumamos dizer que o事件循环

JS determina que a pilha de execução está vazia

emmmmm, não sei. . . . JS deve ter sua própria lógica exclusiva para determinar se a pilha de execução está vazia.

Tarefas assíncronas

A sequência de execução de tarefas assíncronas é: Tarefas macro -> Micro tarefas

Tarefas assíncronas podem ser divididas em

• tarefas macro

• Micro tarefas

Tarefas macro comuns

• I/0

• setTimeout

• setInterval

Micro tarefas comuns

• Promise

• .then

• .catch

Answer

vite Um plug-in configurado antes, há algum problema com a versão, ignore este alarme vermelho.

A análise

• 开始了com uma tarefa síncrona. Ela primeiro entra na pilha de execução

• para executar task() a A entrada na pilha de execução

• é assíncrona/aguardada. executado de forma síncrona. O seguinte código será assíncrono. b entra na pilha de execução como uma tarefa síncrona,

• a end se torna a microtarefa da tarefa assíncrona e entra na pilha de execução.

de tarefas

síncronas foi开始了, a , b

tarefas: setTimeout Microtask: a end

Se não houver código subsequente, a sequência de impressão é a seguinte.

Então aí vem a pergunta: isso não significa que as tarefas macro serão executadas antes das micro tarefas? Por que setTimeout é impresso após a end ?

看这张图

setTimeout entra na fila de tarefas como uma tarefa macro. Portanto, a razão para isso

é de modo geral:

a espera assíncrona leva à geração de microtarefas, mas essa microtarefa pertence à tarefa macro atual. Portanto, a end será executado primeiro e, após a execução, será considerado que a macro tarefa atual foi encerrada. Execute a próxima tarefa de macro, imprima setTimeout

e continue o processo

• c Devido à conversão do Promise, ele se torna uma tarefa síncrona e entra na fila de tarefas

• c end entra na fila de tarefas como uma micro tarefa derivada do Promise

• d

.

• fila de tarefas como uma tarefa síncrona.

Até agora, fila de tarefas de sincronização

• a

• b

• c

• d

até agora, fila de tarefas assíncronas

• a end microtask

• c end microtask

• setTimeout macrotask

então a ordem de impressão é a seguinte.

Pós-escrito:

Meu entendimento do mecanismo de execução JS pode estar um tanto incorreto e espero que vocês possam apontar isso.

[Tutoriais em vídeo relacionados recomendados: front-end da web]

O texto acima é uma análise aprofundada dos detalhes do mecanismo de execução de eventos em JS. Para obter mais informações, preste atenção a outros artigos relacionados no site PHP chinês!