Operadores JavaScript

Lucas Lemos Miranda

1 de julho de 2019

O que é um operador?

Conforme a própria palavra diz, operador é um elemento de um programa aplicado a um ou mais operandos em uma expressão ou instrução.

Por exemplo: 4+5 é igual a 9.

Sendo assim, 4 e 5 são chamados operandos e ‘+’ é chamado de operador. O JavaScript contem os seguintes tipos de operadores.

Operadores aritméticos.
Operadores de Comparação.
Operadores lógicos(ou relacionais).
Operadores de atribuição.
Operadores condicionais(ou ternários).

Enfim, vamos dar uma olhada em todos os operadores, um por um.

Operadores aritméticos

O JavaScript suporta os seguintes operadores aritméticos:

Suponhamos que a variável A contenha 10 e a variável B contenha 20, então:

#	Operador e Descrição
1	+ (Adição) Soma os dois operandos. Ex: A + B = 30
2	– (subtração) Subtrai o segundo operando do primeiro. Ex: A – B = -10
3	* (Multiplicação) Multiplica os dois operandos. Ex: A * B = 200
4	/ (Divisão) Divide o numerador pelo denominador. Ex: B / A = 2
5	% (Módulo) Gera o restante de uma divisão inteira. Ex: B% A = 0
6	++ (incremento) Aumenta um valor inteiro por um. Ex: A ++ = 11
7	– (Decremento) Diminui um valor inteiro por um. Ex: A– = 9

Obs: O operador de adição(+) funciona tanto para números quanto para strings(textos ou caracteres).

Por exemplo: “a” + 10 = “a10”.

Exemplo

O código a seguir mostra como usar operadores aritméticos em JavaScript.

<html>
   <body>
   
      <script type="text/javascript">
         <!--
            var a = 23;
            var b = 20;
            var c = "Teste";
            var quebradelinha = "<br /><br />";
         
            document.write("a + b = ");
            resultado = a + b;
            document.write(resultado);
            document.write(quebradelinha);
         
            document.write("a - b = ");
            resultado = a - b;
            document.write(resultado);
            document.write(quebradelinha);
         
            document.write("a / b = ");
            resultado = a / b;
            document.write(resultado);
            document.write(quebradelinha);
         
            document.write("a % b = ");
            resultado = a % b;
            document.write(resultado);
            document.write(quebradelinha);
         
            document.write("a + b + c = ");
            resultado = a + b + c;
            document.write(resultado);
            document.write(quebradelinha);
         
            a = ++a;
            document.write("++a = ");
            resultado = ++a;
            document.write(resultado);
            document.write(quebradelinha);
         
            b = --b;
            document.write("--b = ");
            resultado = --b;
            document.write(resultado);
            document.write(quebradelinha);
         //-->
      </script>
   </body>
</html>

Resultado:

Operadores de Comparação

O JavaScript suporta os seguintes operadores de comparação:

Suponha que a variável A detenha 10 e a variável B detenha 20, então:

#	Operador e Descrição
1	== (Igual) Verifica se o valor dos dois operandos é igual ou não, se sim, a condição se torna verdadeira. Ex: (A == B) não é verdade.
2	!= (Não igual) Verifica se o valor dos dois operandos são iguais ou não, se os valores não são iguais, então a condição se torna verdadeira. Ex: (A! = B) é verdade.
3	> (Maior que) Verifica se o valor do operando esquerdo é maior que o valor do operando direito, se sim, a condição se torna verdadeira. Ex: (A> B) não é verdade.
4	< (Menos que) Verifica se o valor do operando esquerdo é menor que o valor do operando direito, se sim, a condição se torna verdadeira. Ex: (A <B) é verdade.
5	>= (Maior que ou igual a) Verifica se o valor do operando da esquerda é maior ou igual ao valor do operando da direita, se sim, a condição se torna verdadeira. Ex: (A> = B) não é verdade.
6	<= (Menor que ou igual a) Verifica se o valor do operando esquerdo é menor ou igual ao valor do operando direito, se sim, a condição se torna verdadeira. Ex: (A <= B) é verdade.

Exemplo

O código a seguir mostra como usar operadores de comparação no JavaScript.

<html>
   <body>  
      <script type="text/javascript">
         <!--
            var a = 10;
            var b = 20;
            var quebradelinha = "<br />";
      
            document.write("(a == b) => ");
            resultado = (a == b);
            document.write(resultado);
            document.write(quebradelinha);
         
            document.write("(a < b) => ");
            resultado = (a < b);
            document.write(resultado);
            document.write(quebradelinha);
         
            document.write("(a > b) => ");
            resultado = (a > b);
            document.write(resultado);
            document.write(quebradelinha);
         
            document.write("(a != b) => ");
            resultado = (a != b);
            document.write(resultado);
            document.write(quebradelinha);
         
            document.write("(a >= b) => ");
            resultado = (a >= b);
            document.write(resultado);
            document.write(quebradelinha);
         
            document.write("(a <= b) => ");
            resultado = (a <= b);
            document.write(resultado);
            document.write(quebradelinha);
         //-->
      </script>      
   </body>
</html>

Resultado

(a == b) => false 
(a < b) => true 
(a > b) => false 
(a != b) => true 
(a >= b) => false 
a <= b) => true

Operadores lógicos

JavaScript suporta os seguintes operadores lógicos –

Suponha que a variável A contenha 10 e a variável B contenha 20, então:

#	Operador e Descrição
1	&& (lógica AND) Se ambos os operandos forem diferentes de zero, a condição se tornará verdadeira. Ex: (A && B) é verdade.
2	\|\| (Lógica OU) Se algum dos dois operandos for diferente de zero, a condição se tornará verdadeira. Ex: (A \|\| B) é verdade.
3	! (NÃO lógico) Reverte o estado lógico de seu operando. Se uma condição for verdadeira, então o operador Lógico NOT tornará falsa. Ex: ! (A && B) é falso.

Exemplo

Experimente o seguinte código para aprender como implementar operadores lógicos em JavaScript.

<html>
   <body>   
      <script type="text/javascript">
         <!--
            var a = true;
            var b = false;
            var quebradelinha = "<br />";
      
            document.write("(a && b) => ");
            resultado = (a && b);
            document.write(resultado);
            document.write(quebradelinha);
         
            document.write("(a || b) => ");
            resultado = (a || b);
            document.write(resultado);
            document.write(quebradelinha);
         
            document.write("!(a && b) => ");
            resultado = (!(a && b));
            document.write(resultado);
            document.write(quebradelinha);
         //-->
      </script>      
   </body>
</html>

Resultado

(a && b) => false 
(a || b) => true 
!(a && b) => true

Operadores Bitwise(bit a bit)

O JavaScript suporta os seguintes operadores bitwise:

Por exemplo, suponhamos que a variável A contenha o valor 2 e a variável B contenha o valor 3, então:

#	Operador e Descrição
1	& (BitWise AND) Ele executa uma operação AND booleana em cada bit de seus argumentos inteiros. Ex: (A & B) é 2.
2	\| (BitWise OR) Ele executa uma operação OR booleana em cada bit de seus argumentos inteiros. Ex: (A \| B) é 3.
3	^ (Bitwise XOR) Ele executa uma operação OR exclusiva booleana em cada bit de seus argumentos inteiros. OR exclusivo significa que o operando um é verdadeiro ou o operando dois é verdadeiro, mas não ambos. Ex: (A ^ B) é 1.
4	~ ( BitWise Not) É um operador unário e opera invertendo todos os bits no operando. Ex: (~ B) é -4.
5	<< (deslocamento da esquerda) Ele move todos os bits em seu primeiro operando para a esquerda pelo número de lugares especificado no segundo operando. Novos bits são preenchidos com zeros. Mudar um valor deixado por uma posição é equivalente a multiplicá-lo por 2, deslocando duas posições é equivalente a multiplicar por 4 e assim por diante. Ex: (A << 1) é 4.
6	>> (deslocamento para a direita) Operador de deslocamento à direita binário. O valor do operando da esquerda é movido para a direita pelo número de bits especificado pelo operando da direita. Ex: (A >> 1) é 1.
7	>>> (deslocamento à direita com zero)Este operador é exatamente como o operador >>, exceto que os bits deslocados à esquerda são sempre zero. Ex: (A >>> 1) é 1.

Exemplo

Experimente o seguinte código para implementar o operador Bitwise em JavaScript.

<html>
   <body>   
      <script type="text/javascript">
         <!--
            var a = 2; // Bit presentation 10
            var b = 3; // Bit presentation 11
            var quebradelinha = "<br />";
         
            document.write("(a & b) => ");
            resultado = (a & b);
            document.write(resultado);
            document.write(quebradelinha);
         
            document.write("(a | b) => ");
            resultado = (a | b);
            document.write(resultado);
            document.write(quebradelinha);
         
            document.write("(a ^ b) => ");
            resultado = (a ^ b);
            document.write(resultado);
            document.write(quebradelinha);
         
            document.write("(~b) => ");
            resultado = (~b);
            document.write(resultado);
            document.write(quebradelinha);
         
            document.write("(a << b) => ");
            resultado = (a << b);
            document.write(resultado);
            document.write(quebradelinha);
         
            document.write("(a >> b) => ");
            resultado = (a >> b);
            document.write(resultado);
            document.write(quebradelinha);
         //-->
      </script>      
   </body>
</html>

Resultado

(a & b) => 2 
(a | b) => 3 
(a ^ b) => 1 
(~b) => -4 
(a << b) => 16 
(a >> b) => 0

Operadores de atribuição

O JavaScript suporta os seguintes operadores de atribuição –

#	Operador e Descrição
1	= (Atribuição simples) Atribui valores do operando do lado direito para o operando do lado esquerdo Ex: C = A + B irá atribuir o valor de A + B em C.
2	+= (Adicionar e atribuição) Adiciona ao operando direito o operando esquerdo e atribui o resultado ao operando esquerdo. Ex: C += A é equivalente a C = C + A
3	-= (Subtrair e Atribuição) Subtrai o operando direito do operando esquerdo e atribui o resultado ao operando esquerdo. Ex: C -= A é equivalente a C = C – A
4	= (Multiplicação e atribuição) Multiplica o operando da direita pelo operando da esquerda e atribui o resultado ao operando da esquerda.Ex: C = A é equivalente a C = C * A
5	/= (Dividir e Atribuição)Ele divide o operando da esquerda com o operando da direita e atribui o resultado ao operando da esquerda. Ex: C /= A é equivalente a C = C / A
6	%= (Módulos e atribuição)Ele usa módulo usando dois operandos e atribui o resultado ao operando esquerdo. Ex: C% = A é equivalente a C = C% A

Obs: A mesma lógica se aplica aos operadores Bitwise, de modo que eles se tornarão semelhantes a <<=, >>=, >>=, &=, |= e ^=.

Exemplo

Experimente o seguinte código para implementar os operadores de atribuição em JavaScript.

<html>
   <body>   
      <script type="text/javascript">
         <!--
            var a = 33;
            var b = 10;
            var quebradelinha = "<br />";
         
            document.write("Valor de a => (a = b) => ");
            resultadoado = (a = b);
            document.write(resultadoado);
            document.write(quebradelinha);
         
            document.write("Valor de a => (a += b) => ");
            resultadoado = (a += b);
            document.write(resultadoado);
            document.write(quebradelinha);
         
            document.write("Valor de a => (a -= b) => ");
            resultadoado = (a -= b);
            document.write(resultadoado);
            document.write(quebradelinha);
         
            document.write("Valor de a => (a *= b) => ");
            resultadoado = (a *= b);
            document.write(resultadoado);
            document.write(quebradelinha);
         
            document.write("Valor de a => (a /= b) => ");
            resultadoado = (a /= b);
            document.write(resultadoado);
            document.write(quebradelinha);
         
            document.write("Valor de a => (a %= b) => ");
            resultadoado = (a %= b);
            document.write(resultadoado);
            document.write(quebradelinha);
         //-->
      </script>
   </body>
</html>

Resultado

Valor de a => (a = b) => 10
Valor de a => (a += b) => 20 
Valor de a => (a -= b) => 10 
Valor de a => (a *= b) => 100 
Valor de a => (a /= b) => 10
Valor de a => (a %= b) => 0

Operador Diverso

Vamos discutir aqui dois operadores bastante úteis em JavaScript: o operador condicional ( ? : ) e o operador typeof .

Operador Condicional ( ? : )

O operador condicional primeiro avalia uma expressão para um valor verdadeiro ou falso e, em seguida, executa uma das duas instruções dadas, dependendo do resultado da avaliação.

#	Operador e Descrição
1	? : (Condicional) Se a condição é verdadeira? Então, valor X: Caso contrário, valor Y

Exemplo

Experimente o seguinte código para entender como o Operador Condicional funciona em JavaScript.

<html>
   <body>   
      <script type = "text/javascript">
         <!--
            var a = 10;
            var b = 20;
            var quebradelinha = "<br />";
         
            document.write ("((a > b) ? 100 : 200) => ");
            resultado = (a > b) ? 100 : 200;
            document.write(resultado);
            document.write(quebradelinha);
         
            document.write ("((a < b) ? 100 : 200) => ");
            resultado = (a < b) ? 100 : 200;
            document.write(resultado);
            document.write(quebradelinha);
         //-->
      </script>      
   </body>
</html>

Resultado

((a > b) ? 100 : 200) => 200 
((a < b) ? 100 : 200) => 100

Operador typeof

O operador typeof é um operador unário colocado antes de seu único operando, que pode ser de qualquer tipo. Seu valor é uma string indicando o tipo de dados do operando.

O operador typeof é avaliado como “number”, “string” ou “boolean” se seu operando for um número, string ou valor booleano e retorna true ou false com base na avaliação.

Aqui está uma lista dos valores de retorno para o tipo de operador.

Type	Retorno de typeof
Number	“number”
String	“string”
Boolean	“boolean”
Object	“object”
Function	“function”
Undefined	“undefined”
Null	“object”

Exemplo

O código a seguir mostra como implementar o operador typeof.

<html>
   <body>      
      <script type="text/javascript">
         <!--
            var a = 10;
            var b = "String";
            var quebradelinha = "<br />";
         
            resultado = (typeof b == "string" ? "B é uma String" : "B é um número");
            document.write("resultado => ");
            document.write(resultado);
            document.write(quebradelinha);
         
            resultado = (typeof a == "string" ? "A é uma String" : "A é um número");
            document.write("resultado => ");
            document.write(resultado);
            document.write(quebradelinha);
         //-->
      </script>      
   </body>
</html>

Resultado

resultado => B é uma String 
resultado => A é um número

Gostou do artigo? deixe um comentário para nos incentivar!