Operadores em JavaScript

Operadores em JavaScript

Neste artigo, explicaremos os operadores em JavaScript.

YouTube Video

Operadores em JavaScript

Os operadores em JavaScript são símbolos ou palavras-chave usadas para realizar cálculos ou comparações em números e variáveis. Existem vários tipos de operadores, cada um realizando operações diferentes. Aqui estão resumidos alguns dos principais operadores:.

Operadores Aritméticos

Os operadores aritméticos do JavaScript incluem o seguinte:.

Operador Descrição Exemplo Resultado
+ Adição 5 + 2 7
- Subtração 5 - 2 3
* Multiplicação 5 * 2 10
/ Divisão 5 / 2 2.5
% Módulo (Resto) 5 % 2 1
++ Incremento (Aumentar em 1) let x = 5; x++ 6
-- Decremento (Diminuir em 1) let x = 5; x-- 4
 1let a = 10; // Initialize variable 'a' with the value 10
 2let b = 3;  // Initialize variable 'b' with the value 3
 3
 4// Perform and display arithmetic operations between 'a' and 'b'
 5console.log("Addition (a + b):      ", a + b); // 13
 6console.log("Subtraction (a - b):   ", a - b); // 7
 7console.log("Multiplication (a * b):", a * b); // 30
 8console.log("Division (a / b):      ", a / b); // 3.333...
 9console.log("Modulus (a % b):       ", a % b); // 1
10
11// Demonstrate post-increment operation on 'a'
12// Output the current value of 'a' (10), then increment
13console.log("Post-increment (a++):  ", a++);
14// Display the incremented value of 'a' (11)
15console.log("Value of 'a' after increment:", a);
16
17// Demonstrate pre-increment operation on 'a'
18// Increment 'a' first (12) then output
19console.log("Pre-increment (++a):   ", ++a);
20
21// Demonstrate post-decrement operation on 'a'
22// Output the current value of 'a' (12), then decrement
23console.log("Post-decrement (a--):  ", a--);
24// Display the decremented value of 'a' (11)
25console.log("Value of 'a' after decrement:", a);
26
27// Demonstrate pre-decrement operation on 'a'
28// Decrement 'a' first (10) then output
29console.log("Pre-decrement (--a):   ", --a);

Os operadores aritméticos realizam operações matemáticas básicas em números. Além de adição e subtração, você pode realizar operações como módulo, incremento e decremento. Observe que o valor retornado pelo incremento ou decremento difere dependendo se o operador é colocado antes ou depois do operando.

Operadores de Atribuição

Os operadores de atribuição do JavaScript incluem o seguinte:.

Operador Descrição Exemplo Resultado
= Atribuição x = 5 x recebe o valor 5
+= Atribuição de adição x += 5 x = x + 5
-= Atribuição de subtração x -= 5 x = x - 5
*= Atribuição de multiplicação x *= 5 x = x * 5
/= Atribuição de divisão x /= 5 x = x / 5
%= Atribuição de módulo x %= 5 x = x % 5
 1let x = 10;
 2
 3x += 5;  // x = x + 5, so x becomes 15
 4console.log('After x += 5 : ', x);  // 15
 5
 6x -= 10;
 7console.log('After x -= 10 : ', x);  // 5
 8
 9x *= 3;
10console.log('After x *= 3 : ', x);  // 15
11
12x /= 3;
13console.log('After x /= 3 : ', x);  // 5
14
15x %= 2;
16console.log('After x %= 2 : ', x);  // 1

Os operadores de atribuição são usados para atribuir valores a variáveis ou atualizar os valores de variáveis. Além da atribuição regular, existem operadores de atribuição para operações aritméticas como adição e módulo.

Operadores de Comparação

Os operadores de comparação do JavaScript incluem o seguinte:.

Operador Descrição Exemplo Resultado
== Igual 5 == "5" true
=== Estritamente Igual (Ambos tipo e valor são iguais) 5 === "5" false
!= Diferente 5 != "5" false
!== Estritamente Diferente 5 !== "5" true
> Maior Que 5 > 2 true
< Menor Que 5 < 2 false
>= Maior ou Igual a 5 >= 5 true
<= Menor ou Igual a 5 <= 4 false
 1console.log("5 == '5' evaluates to:", 5 == "5");   // true (because the values are equal)
 2console.log("5 === '5' evaluates to:", 5 === "5"); // false (because the types are different)
 3console.log("5 != '5' evaluates to:", 5 != "5");   // false
 4console.log("5 !== '5' evaluates to:", 5 !== "5"); // true
 5console.log("5 > 2 evaluates to:", 5 > 2);         // true
 6console.log("5 < 2 evaluates to:", 5 < 2);         // false
 7console.log("5 >= 5 evaluates to:", 5 >= 5);       // true
 8console.log("5 <= 4 evaluates to:", 5 <= 4);       // false
 9console.log("5 >= '5' evaluates to:", 5 >= "5");   // true
10console.log("5 <= '5' evaluates to:", 5 <= "5");   // true
  • Os operadores de comparação comparam valores e retornam verdadeiro ou falso.
  • O operador de igualdade (==) converte automaticamente diferentes tipos, se necessário, antes de realizar a comparação. O operador de igualdade estrita (===) não realiza nenhuma conversão de tipo durante a comparação e retorna true apenas se ambos os valores tiverem o mesmo tipo e o mesmo valor. Usar o operador de igualdade estrita (===) ajuda a evitar erros causados por conversões de tipo não intencionais, por isso recomenda-se usá-lo preferencialmente.

Operadores Lógicos

Os operadores lógicos do JavaScript incluem o seguinte:.

Operador Descrição Exemplo Resultado
&& E (Verdadeiro se ambas as condições forem verdadeiras) true && false false
|| OU (Verdadeiro se qualquer uma das condições for verdadeira) true || false true
! NÃO (Transforma verdadeiro em falso e falso em verdadeiro) !true false
1let a = true;
2let b = false;
3
4console.log("a && b evaluates to:", a && b);  // false
5console.log("a || b evaluates to:", a || b);  // true
6console.log("!a evaluates to:", !a);          // false

Os operadores lógicos são usados quando há várias condições, para avaliar combinações de condições.

Prioridade dos Operadores Lógicos

No JavaScript, os operadores lógicos geralmente são avaliados na ordem NOT primeiro, seguido por AND e, por último, OR.

NOT tem a maior precedência

NOT é um operador unário e é avaliado com a maior precedência.

1console.log(!true || false);  // false
AND tem precedência sobre OR

AND tem maior precedência que OR, então a parte AND é avaliada primeiro.

1console.log(true || false && false);  // true

Dessa forma, a parte AND (&&) é avaliada primeiro, e seu resultado é passado para OR (||).

AND e OR realizam avaliação de curto-circuito

Os operadores AND e OR do JavaScript realizam avaliação de curto-circuito. Se o resultado puder ser determinado pelo valor à esquerda, a expressão do lado direito não será avaliada.

1let a = false && console.log("This will not be printed");
2console.log(a);  // false
3
4let b = true || console.log("This will not be printed");
5console.log(b);  // true

Em ambos os casos, o console.log() não será executado.

Estabeleça precedência explícita

Ao agrupar expressões explicitamente com parênteses, você pode evitar mal-entendidos sobre a precedência.

1console.log(true || (false && false));  // true
Diferenças entre a linguagem natural e a interpretação do programa

Ao utilizar operadores lógicos, é importante estar ciente das ambiguidades na linguagem natural. Por exemplo, ao dizer 'cachorro branco ou gato,' isso pode significar tanto 'um cachorro branco ou qualquer cor de gato' quanto 'um cachorro branco ou um gato branco.'. Em código, isso ficaria assim:.

1if (isWhite && isDog || isCat) {
2    console.log(' "A white dog" or "a cat of any color" ');
3}
4
5if (isWhite && (isDog || isCat)) {
6    console.log(' "A white dog" or "a white cat" ');
7}
8
9console.log(true || (false && false));  // true

Como a linguagem natural contém ambiguidades como essa, é necessário cuidado ao programar ou elaborar.

Operador Ternário (Operador Condicional)

O JavaScript inclui um operador ternário (operador condicional).

Operador Descrição Exemplo Resultado
? : Se a condição for verdadeira, o lado esquerdo é executado; caso contrário, o lado direito condição ? se verdadeiro : se falso Resultado com base na condição
1let age = 20;
2let message = age >= 18 ? "Adult" : "Minor";
3console.log(message);  // "Adult"

Ele é escrito na forma condição ? valor se verdadeiro : valor se falso.

Operadores Bit a Bit

Os operadores bit a bit do JavaScript incluem o seguinte.

Operador Descrição Exemplo Resultado
& AND 5 & 1 1
| OR 5 | 1 5
^ XOR 5 ^ 1 4
~ NOT ~5 -6
<< Deslocamento para Esquerda 5 << 1 10
>> Deslocamento para a direita 5 >> 1 2
 1let x = 0x0F & 0x0C;
 2console.log("0x0F & 0x0C evaluates to:", x, "(0x0C, 12)");  // 0x0C (12)
 3
 4x = 0x04 | 0x02;
 5console.log("0x04 | 0x02 evaluates to:", x, "(0x06, 6)");  // 0x06 (6)
 6
 7x = 0x0F ^ 0x0C;
 8console.log("0x0F ^ 0x0C evaluates to:", x, "(0x03, 3)");  // 0x03 (3)
 9
10// The inverted number is represented as a negative value
11// because JavaScript numbers are stored as signed 32-bit integers.
12x = ~0x0C;
13console.log("~0x0C evaluates to:", x, "(-13, 0xF3)");  // 0xF3 (-13)
14
15x = 0x04 << 1;
16console.log("0x04 << 1 evaluates to:", x, "(0x08, 8)");    // 0x08 (8)
17x = 0x04 >> 1;
18console.log("0x04 >> 1 evaluates to:", x, "(0x02, 2)");    // 0x02 (2)

Os operadores de bits realizam cálculos em números no nível de bits. Eles geralmente são usados para processamento de baixo nível.

Operadores de Tipo

Os operadores de tipo do JavaScript incluem o seguinte.

Operador Descrição Exemplo Resultado
typeof Retorna o tipo de uma variável typeof 123 "number"
instanceof Verifica se um objeto pertence a uma classe específica arr instanceof Array true
1console.log(typeof "Hello");  // "string"
2console.log(typeof 42);       // "number"
3
4let arr = [1, 2, 3];
5console.log("arr instanceof Array : ", arr instanceof Array); // true

Operadores de tipo são usados para verificar o tipo de um valor ou convertê-lo para um tipo específico.

O operador typeof retorna o tipo de uma variável.

O operador instanceof verifica se um objeto pertence a uma classe específica.

Resumo

  • Operadores aritméticos realizam cálculos básicos.
  • Operadores de atribuição atribuem ou atualizam valores em variáveis.
  • Operadores de comparação comparam dois valores e retornam verdadeiro ou falso.
  • Operadores lógicos avaliam combinações de condições.
  • Operadores ternários permitem escrever declarações condicionais em uma forma mais curta do que if.
  • Operadores bit a bit realizam cálculos no nível de bits.
  • Operadores de tipo permitem verificar o tipo de um valor.

Você pode acompanhar o artigo acima usando o Visual Studio Code em nosso canal do YouTube. Por favor, confira também o canal do YouTube.

YouTube Video