Neste tutorial, você aprenderá sobre a instrução if… else para criar programas de tomada de decisão com a ajuda de exemplos.
Na programação de computadores, podem surgir situações em que você precise executar um bloco de código entre mais de uma alternativa. Por exemplo, atribuir notas A , B ou C com base nas notas obtidas por um aluno.
Em tais situações, você pode usar a if… elseinstrução JavaScript para criar um programa que pode tomar decisões.
Em JavaScript, existem três formas de if… elsedeclaração.
- declaração if
- declaração if … else
- if … else if … else declaração
JavaScript if declaração
A sintaxe da ifdeclaração é:
if (condition) ( // the body of if )
A ifinstrução avalia a condição entre parênteses ().
- Se a condição for avaliada como
true, o código dentro do corpo deifé executado. - Se a condição for avaliada como
false, o código dentro do corpo deifserá ignorado.
Observação: o código interno ( )é o corpo da ifinstrução.
Funcionamento da declaração if
Exemplo 1: declaração if
// check if the number is positive const number = prompt("Enter a number: "); // check if number is greater than 0 if (number> 0) ( // the body of the if statement console.log("The number is positive"); ) console.log("The if statement is easy");
Produto 1
Insira um número: 2 O número é positivo A declaração if é fácil
Suponha que o usuário inseriu 2 . Nesse caso, a condição é number> 0avaliada como true. E, o corpo da ifinstrução é executado.
Produto 2
Insira um número: -1 A instrução if é fácil
Suponha que o usuário inseriu -1 . Nesse caso, a condição é number> 0avaliada como false. Portanto, o corpo da ifinstrução é ignorado.
Como console.log("The if statement is easy");está fora do corpo da ifinstrução, é sempre executado.
Operadores de comparação e lógicos são usados em condições. Portanto, para aprender mais sobre comparação e operadores lógicos, você pode visitar Comparação de JavaScript e operadores lógicos.
JavaScript if… else declaração
Uma ifdeclaração pode ter uma elsecláusula opcional . A sintaxe da if… elsedeclaração é:
if (condition) ( // block of code if condition is true ) else ( // block of code if condition is false )
A if… elseinstrução avalia a condição entre parênteses.
Se a condição for avaliada para true,
- o código dentro do corpo de
ifé executado - o código dentro do corpo de
elseé ignorado da execução
Se a condição for avaliada para false,
- o código dentro do corpo de
elseé executado - o código dentro do corpo de
ifé ignorado da execução
Funcionando da instrução if … else
Exemplo 2: declaração if… else
// check is the number is positive or negative/zero const number = prompt("Enter a number: "); // check if number is greater than 0 if (number> 0) ( console.log("The number is positive"); ) // if number is not greater than 0 else ( console.log("The number is either a negative number or 0"); ) console.log("The if… else statement is easy");
Produto 1
Insira um número: 2 O número é positivo A instrução if… else é fácil
Suponha que o usuário inseriu 2 . Nesse caso, a condição é number> 0avaliada como true. Portanto, o corpo da ifinstrução é executado e o corpo da elseinstrução é ignorado.
Produto 2
Insira um número: -1 O número é um número negativo ou 0 A instrução if… else é fácil
Suponha que o usuário inseriu -1 . Nesse caso, a condição é number> 0avaliada como false. Portanto, o corpo da elseinstrução é executado e o corpo da ifinstrução é ignorado.
JavaScript if… else if instrução
A if… elseinstrução é usada para executar um bloco de código entre duas alternativas. No entanto, se você precisar fazer uma escolha entre mais de duas alternativas, if… else if… elsepode ser usado.
A sintaxe da if… else if… elsedeclaração é:
if (condition1) ( // code block 1 ) else if (condition2)( // code block 2 ) else ( // code block 3 )
- Se a condição1 resultar em
true, o bloco de código 1 será executado. - Se a condição1 for avaliada como
false, a condição2 será avaliada.- Se a condição2 for
true, o bloco de código 2 é executado. - Se a condição2 for
false, o bloco de código 3 será executado.
- Se a condição2 for
Funcionando da instrução if … else if … else
Exemplo 3: if… else if declaração
// check if the number if positive, negative or zero const number = prompt("Enter a number: "); // check if number is greater than 0 if (number> 0) ( console.log("The number is positive"); ) // check if number is 0 else if (number == 0) ( console.log("The number is 0"); ) // if number is neither greater than 0, nor zero else ( console.log("The number is negative"); ) console.log("The if… else if… else statement is easy");
Resultado
Insira um número: 0 O número é 0 A instrução if … else if … else é fácil
Suponha que o usuário inseriu 0 , então a primeira condição de teste number> 0avalia para false. Em seguida, a segunda condição de teste é number == 0avaliada truee seu bloco correspondente é executado.
Declaração aninhada if… else
Você também pode usar uma if… elseinstrução dentro de uma if… elseinstrução. Isso é conhecido como instrução aninhada if… else .
Exemplo 4: Declaração aninhada if… else
// check if the number is positive, negative or zero const number = prompt("Enter a number: "); if (number>= 0) ( if (number == 0) ( console.log("You entered number 0"); ) else ( console.log("You entered a positive number"); ) ) else ( console.log("You entered a negative number"); )
Resultado
Enter a number: 5 You entered a positive number
Suppose the user entered 5. In this case, the condition number>= 0 evaluates to true, and the control of the program goes inside the outer if statement.
Then, the test condition, number == 0, of the inner if statement is evaluated. Since it's false, the else clause of the inner if statement is executed.
Note: As you can see, nested if… else makes our logic complicated and we should try to avoid using nested if… else whenever possible.
Body of if… else With Only One Statement
If the body of if… else has only one statement, we can omit ( ) in our programs. For example, you can replace
const number = 2; if (number> 0) ( console.log("The number is positive."); ) else ( console.log("The number is negative or zero."); )
with
const number = 2; if (number> 0) console.log("The number is positive."); else console.log("The number is negative or zero.");
Output
The number is positive.
More on Decision Making
Em certas situações, um operador ternário pode substituir uma if… elseinstrução. Para saber mais, visite JavaScript Ternary Operator.
Se você precisar fazer uma escolha entre mais de uma alternativa com base em uma determinada condição de teste, a switchinstrução pode ser usada. Para saber mais, visite JavaScript switch.
