JavaScript if else if

Índice

    Mostrar índice

Instruções condicionais são usadas para executar ações diferentes com base em condições diferentes.

Declarações Condicionais

Muitas vezes, quando você escreve código, deseja executar ações diferentes para decisões diferentes.

Você pode usar instruções condicionais em seu código para fazer isso.

Em JavaScript, temos as seguintes instruções condicionais:

  • Use if para especificar um bloco de código a ser executado, se uma condição especificada for verdadeira

  • Use else para especificar um bloco de código a ser executado, se a mesma condição for falso

  • Use else if para especificar uma nova condição para testar, se a primeira condição for falsa

  • Use switch para especificar muitos blocos alternativos de código a serem executados

A instrução switch é descrita no próximo capítulo.

A instrução if

Use a instrução if para especificar um bloco de código JavaScript para ser executado se uma condição for verdadeira.

Sintaxe

if (condition) {
  //  block of code to be executed if the condition is true
 }

Observe que if está em letras minúsculas. Letras maiúsculas (If ou IF) gerarão um erro de JavaScript.

Exemplo

Faça uma saudação de "Bom dia" se a hora for inferior a 18:00:

if (hour < 18) {
    greeting = "Good day";
 }

O resultado da saudação será:

Experimente você mesmo →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript if</h2>

<p>Display "Good day!" if the hour is less than 18:00:</p>

<p id="demo">Good Evening!</p>

<script>
if (new Date().getHours() < 18) {
  document.getElementById("demo").innerHTML = "Good day!";
}
</script>

</body>
</html>

A instrução else

Use a instrução else para especificar um bloco de código a ser executado se a condição for falso.

if (condition) {
  //  block of code to be executed if the condition is true
 }
else {

  //  block of code to be executed if the condition is false
 }

Exemplo

Se a hora for inferior a 18, crie um "Bom dia" saudação, caso contrário "Boa noite":

if (hour < 18) {
    greeting = "Good day";
 }
else {
    greeting = "Good evening";
 }

O resultado da saudação será:

Experimente você mesmo →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript if .. else</h2>

<p>A time-based greeting:</p>

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

<script>
const hour = new Date().getHours(); 
let greeting;

if (hour < 18) {
  greeting = "Good day";
} else {
  greeting = "Good evening";
}

document.getElementById("demo").innerHTML = greeting;
</script>

</body>
</html>

A instrução else if

Use a instrução else if para especificar uma nova condição se a primeira condição for falsa.

Sintaxe

if (condition1) {
  //  block of code to be executed if condition1 is true
 }
else if (condition2) {
  //  block of code to be executed if the condition1 is false and condition2 is true
} else {
  //  block of code to be executed if the condition1 is false and condition2 is false
 }

Exemplo

Se o horário for inferior a 10h, crie um "Bom manhã" saudação, se não, mas o horário for inferior a 20h, crie uma saudação de "Bom dia", caso contrário, um "Boa noite":

if (time < 10) {
    greeting = "Good morning";
 }
else if (time < 20) {
    greeting = "Good day";
 }
else {
    greeting = "Good evening";
 }

O resultado da saudação será:

Experimente você mesmo →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript if .. else</h2>

<p>A time-based greeting:</p>

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

<script>
const time = new Date().getHours();
let greeting;
if (time < 10) {
  greeting = "Good morning";
} else if (time < 20) {
  greeting = "Good day";
} else {
  greeting = "Good evening";
}
document.getElementById("demo").innerHTML = greeting;
</script>

</body>
</html>

Mais exemplos

Link aleatório

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Math.random()</h2>

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

<script>
let text;
if (Math.random() < 0.5) {
  text = "<a href='https://w3schools.com'>Visit W3Schools</a>";
} else {
  text = "<a href='https://wwf.org'>Visit WWF</a>";
}
document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>