Se você não consegue entender o mecanismo de corrida da linguagem JavaScript, ou simplesmente colocar, não pode dominar a ordem de execução do JavaScript, então você é como um bole que não pode controlar um cavalo de mil milhas, permitindo que o cavalo de mil milhas escape e corra em volta.
Então, como o JavaScript analisa? Qual é a sua ordem de execução? Antes de entendermos isso, vamos primeiro entender alguns termos importantes:
1. Bloco de código
Um bloco de código no JavaScript refere -se a um segmento de código dividido pela tag <Script>. Por exemplo:
A cópia do código é a seguinte:
<script type = "text/javascript">
alerta ("Este é o bloco de código um");
</script>
<script type = "text/javascript">
alerta ("Este é o bloco de código dois");
</script>
O JS é compilado e executado de acordo com os blocos de código. O que isso significa?
A cópia do código é a seguinte:
<script type = "text/javascript">
alerta (str); // porque o STR não está definido, o navegador terá um erro e o seguinte não pode ser executado
alerta ("Eu sou o código do código um"); // não estou correndo aqui
var test = "eu sou uma variável de bloco de código";
</script>
<script type = "text/javascript">
Alerta ("Eu sou o Código Bloco Dois");
alerta (teste);
</script>
No código acima, um erro é relatado no Bloco Código um, mas não afeta a execução do bloco de código dois. -Compartilhamento de bloqueio.
2. Funções declarativas e funções de atribuição
As definições de função no JS são divididas em dois tipos: funções declarativas e funções de atribuição.
A cópia do código é a seguinte:
<script type = "text/javascript">
função fn () {// função declaracional
}
var fn = função {// função de atribuição
}
</script>
A diferença entre uma função declarativa e uma função de atribuição é que, durante o período de pré -compilação do JS, a função declarativa será extraída primeiro e, em seguida, o código JS será executado em ordem.
3. Período de pré -compilação e período de execução
De fato, o processo de análise de JS é dividido em dois estágios: período de pré -compilação (pré -processamento) e período de execução.
Durante o período de pré -compilação, o JS processará todas as variáveis e funções declaradas neste bloco de código (semelhante à compilação de c), mas deve -se notar que, neste momento, a única coisa que lida com as funções é declarativa e as variáveis são apenas declarado.
A cópia do código é a seguinte:
<script type = "text/javascript">
Fn ();
função fn () {// função 1
alerta ("A função 1 foi executada");
}
função fn () {// função 2
alerta ("A função 2 foi executada");
}
</script>
<script type = "text/javascript">
FN (); // Resultado da execução: "A função declarativa foi executada", a função foi declarada e processada durante o período de pré -compilação; portanto, mesmo que a função de chamada fn () seja colocada antes da declaração da função de declaração.
função fn () {// função declaracional
alerta ("função declarada executada");
}
var fn = function () {// função de atribuição
alerta ("execute a função de atribuição");
}
</script>
// Bloco de código um
<script type = "text/javascript">
alerta (str); // o erro do navegador relatado, mas a janela de informações não apareceu
</script>
// Bloco de código dois
<script type = "text/javascript">
Alerta (STR);
var str = "aaa";
</script>
// O JS declara a variável durante o período de pré -processamento, mas não inicializa e atribui valores; portanto, a variável no bloco de código 2 não está liquidada, enquanto a variável no código um não existe, portanto, o navegador relata um erro.
Depois de entender os termos acima, acredito que você tem uma impressão aproximada do mecanismo de corrida do JS.
A cópia do código é a seguinte:
<script type = "text/javascript">
Fn (); // Erro do navegador: "indefinido"
</script>
<script type = "text/javascript">
função fn () {// função 1
alerta ("A função 1 foi executada");
}
</script>
Por que o navegador relata um erro ao executar o código acima? A função de declaração não é processada durante o período de pré -processamento? De fato, este é um ponto de entendimento mal. Código.
Agora, vamos resumir e organizar:
A cópia do código é a seguinte:
Etapa 1. Leia o primeiro bloco de código.
Etapa 2. Faça uma análise de sintaxe.
Etapa 3. Faça "processamento de pré-compilação" de variáveis VAR e definições de função (nunca haverá relatórios de erros porque apenas a declaração correta é analisada).
Etapa 4. Execute o segmento de código e, se houver algum erro, será relatado um erro (como a variável não será definida).
Etapa 5. Se houver outro segmento de código, leia o próximo segmento de código e repita a etapa2.
Etapa 6.
De acordo com a ordem de execução dos fluxos de documentos HTML, o código JS que precisa ser executado antes da renderização dos elementos da página deve ser colocado no bloco de código <Script> antes de <body>, e o JS após o carregamento dos elementos da página deve ser colocado No </pody> após o elemento, o evento Onload da etiqueta corporal é executado no final.
A cópia do código é a seguinte:
<script type = "text/javascript">
alerta ("primeiro");
função fn () {
alerta ("terceiro");
}
</script>
<corpo onload = "fn ()">
</body>
<script type = "text/javascript">
alerta ("segundo");
</script>