Comentários JavaScript

Índice

Mostrar índice

Comentários JavaScript podem ser usados para explicar o código JavaScript e para torná-lo mais legível.

Comentários JavaScript também podem ser usados para impedir a execução, quando testando código alternativo.

Comentários de linha única

Comentários de linha única começam com //.

Qualquer texto entre // e o final da linha será ignorado pelo JavaScript (não será executado).

Este exemplo usa um comentário de linha única antes de cada linha de código:

Exemplo

// Change heading:
document.getElementById("myH").innerHTML = "My First Page";

// Change paragraph:
document.getElementById("myP").innerHTML = "My first paragraph.";

Experimente você mesmo →

<!DOCTYPE html>
<html>
<body>

<h1 id="myH"></h1>
<p id="myP"></p>

<script>
// Change heading:
document.getElementById("myH").innerHTML = "JavaScript Comments";
// Change paragraph:
document.getElementById("myP").innerHTML = "My first paragraph.";
</script>

</body>
</html>

Este exemplo usa um comentário de uma única linha no final de cada linha para explicar o código:

Exemplo

let x = 5;      // Declare x, give it the value of 5
let y = x + 2;  // Declare y, give it the value of x + 2

Experimente você mesmo →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Comments</h2>

<p id="demo"></p>

<script>
let x = 5;      // Declare x, give it the value of 5
let y = x + 2;  // Declare y, give it the value of x + 2 

// Write y to demo:
document.getElementById("demo").innerHTML = y;
</script>


</body>
</html>

Comentários multilinhas

Comentários de várias linhas começam com /* e terminam com */.

Qualquer texto entre /* e */ será ignorado pelo JavaScript.

Este exemplo usa um comentário de múltiplas linhas (um bloco de comentários) para explicar o código:

Exemplo

/*
The code below will change
the heading with id = "myH"
and the paragraph with id = "myP"
in my web page:
*/
document.getElementById("myH").innerHTML = "My First Page";
document.getElementById("myP").innerHTML = "My first paragraph.";

Experimente você mesmo →

<!DOCTYPE html>
<html>
<body>

<h1 id="myH"></h1>
<p id="myP"></p>

<script>
/*
The code below will change
the heading with id = "myH"
and the paragraph with id = "myP"
*/
document.getElementById("myH").innerHTML = "JavaScript Comments";
document.getElementById("myP").innerHTML = "My first paragraph.";
</script>

</body>
</html>

É mais comum usar comentários de uma única linha.
Comentários em bloco geralmente são usado para documentação formal.

Usando comentários para impedir a execução

Usar comentários para impedir a execução de código é adequado para teste de código.

Adicionar // na frente de uma linha de código altera as linhas de código de uma linha executável para um comentário.

Este exemplo usa/para impedir a execução de uma das linhas de código:

Exemplo

//document.getElementById("myH").innerHTML = "My First Page";
document.getElementById("myP").innerHTML = "My first paragraph.";

Experimente você mesmo →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Comments</h2>

<h1 id="myH"></h1>

<p id="myP"></p>

<script>
//document.getElementById("myH").innerHTML = "My First Page";
document.getElementById("myP").innerHTML = "My first paragraph.";
</script>

<p>The line starting with // is not executed.</p>

</body>
</html>

Este exemplo usa um bloco de comentários para impedir a execução de múltiplas linhas:

Exemplo

/*
document.getElementById("myH").innerHTML = "My First Page";
document.getElementById("myP").innerHTML = "My first paragraph.";
*/

Experimente você mesmo →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Comments</h2>

<h1 id="myH"></h1>

<p id="myP"></p>

<script>
/*
document.getElementById("myH").innerHTML = "Welcome to my Homepage";
document.getElementById("myP").innerHTML = "This is my first paragraph.";
*/
document.getElementById("myP").innerHTML = "The comment-block is not executed.";
</script>


</body>
</html>