Como muitas linguagens de programação, o JavaScript usa o ponto-e-vírgula (;) para separar as instruções umas das outras. Isso é importante para tornar claro o significado de seu código: sem um separador, o final de uma instrução pode parecer o início da próxima ou vice-versa. Em JavaScript, você geralmente pode omitir o ponto-e-vírgula entre duas instruções se essas instruções forem escritas em linhas separadas. (Você também pode omitir um ponto-e-vírgula no final de um programa ou se o próximo token no programa for uma chave de fechamento:}.) Muitos programadores de JavaScript usam ponto-e-vírgula para marcar explicitamente o final das instruções , mesmo onde eles não são necessários. Outro estilo é omitir ponto e vírgula sempre que possível, usando-os apenas nas poucas situações que os exigem. Seja qual for o estilo escolhido, existem alguns detalhes que você deve entender sobre ponto-e-vírgula opcionais em JavaScript.

Considere o seguinte código. Como as duas instruções aparecem em linhas separadas, o primeiro ponto e vírgula pode ser omitido:

a = 3;
b = 4;

Escrito da seguinte forma, no entanto, o primeiro ponto e vírgula é obrigatório:

a = 3; b = 4;

Observe que o JavaScript não trata cada quebra de linha como um ponto-e-vírgula: ele geralmente trata as quebras de linha como ponto-e-vírgula apenas se não puder analisar o código sem adicionar um ponto-e-vírgula implícito. Mais formalmente (e com três exceções descritas um pouco mais tarde), JavaScript trata uma quebra de linha como um ponto-e-vírgula se o próximo caractere não espacial não puder ser interpretado como uma continuação da instrução atual. Considere o seguinte código:

let a
a = 3
console.log(a)

JavaScript interpreta esse código assim:

let a; a = 3; console.log(a);

JavaScript trata a primeira quebra de linha como um ponto-e-vírgula porque ele não pode analisar o código let a sem um ponto-e-vírgula. O segundo a poderia ser independente como a instrução a ;, mas JavaScript não trata a segunda quebra de linha como um ponto e vírgula porque pode continuar a analisar a instrução mais longa a = 3 ;.

Essas regras de encerramento de instrução levam a alguns casos surpreendentes. Este código se parece com duas instruções separadas separadas por uma nova linha:

let y = x + f
(a + b).toString()

Mas os parênteses na segunda linha de código podem ser interpretados como uma invocação de função de f da primeira linha, e JavaScript interpreta o código como este:

let y = x + f(a + b).toString();

Muito provavelmente, esta não é a interpretação pretendida pelo autor do código. Para funcionar como duas instruções separadas, um ponto-e-vírgula explícito é necessário neste caso.

Em geral, se uma declaração começar com (, [, /, + ou -, há uma chance de que ela possa ser interpretada como uma continuação da declaração anterior. As declarações que começam com /, + e - são muito raras na prática , mas as instruções começando com (e [não são incomuns, pelo menos em alguns estilos de programação JavaScript. Alguns programadores gostam de colocar um ponto-e-vírgula defensivo no início de qualquer uma dessas instruções para que continue a funcionar corretamente mesmo se a instrução antes de ser modificado e um ponto-e-vírgula de terminação anterior removido:

let x = 0 // Ponto e vírgula omitido aqui
; [x, x + 1, x + 2].forEach(console.log) // Defensivo; mantém esta declaração separada

Existem três exceções à regra geral de que o JavaScript interpreta as quebras de linha como ponto e vírgula quando não pode analisar a segunda linha como uma continuação da instrução na primeira linha. A primeira exceção envolve as instruções return, throw, yield, break e continue. Essas instruções geralmente são independentes, mas às vezes são seguidas por um identificador ou expressão. Se uma quebra de linha aparecer após qualquer uma dessas palavras (antes de quaisquer outros tokens), o JavaScript sempre interpretará essa quebra de linha como um ponto-e-vírgula. Por exemplo, se você escrever:

return
true;

JavaScript assume que você quis dizer:

return; true;

No entanto, você provavelmente quis dizer:

return true;

Isso significa que você não deve inserir uma quebra de linha entre return, break ou continue e a expressão que segue a palavra-chave. Se você inserir uma quebra de linha, seu código provavelmente falhará de uma maneira não óbvia que é difícil de depurar.

A segunda exceção envolve os operadores ++ e −−. Esses operadores podem ser operadores de prefixo que aparecem antes de uma expressão ou operadores pós-fixados que aparecem depois de uma expressão. Se você quiser usar qualquer um desses operadores como operadores pós-fixados, eles devem aparecer na mesma linha da expressão à qual se aplicam. A terceira exceção envolve funções definidas usando uma sintaxe concisa de “seta”: a própria seta => deve aparecer na mesma linha da lista de parâmetros.

Texto retirado do livro "Javascript The Definitive Guide" de David Flanagan.