Operadores JavaScript

Índice

    Mostrar índice

O Operador de Adição + adiciona números:

O Operador de Atribuição = atribui um valor a uma variável.

Atribuição JavaScript

O Operador de Atribuição (=) atribui um valor a uma variável:

Exemplos de tarefas

let x = 10;

Experimente você mesmo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Operators</h1>
<h2>The = Operator</h2>

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

<script>
let x = 10;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

// Assign the value 5 to x
let x = 5;
// Assign the value 2 to y
let y = 2;
// Assign the value x + y to z:
let z = x + y;

Experimente você mesmo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Operators</h1>
<h2>The Assignment (=) Operator</h2>

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

<script>
// Assign the value 5 to x
let x = 5;
// Assign the value 2 to y
let y = 2;
// Assign the value x + y to z
let z = x + y;
// Display z
document.getElementById("demo").innerHTML = "The sum of x + y is: " + z;
</script>

</body>
</html>

Adição de JavaScript

O Operador de Adição (+) adiciona números:

Adicionando

let x = 5;
let y = 2;
let z = x + y;

Experimente você mesmo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>The + Operator</h2>

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

<script>
let x = 5;
let y = 2;
let z = x + y;
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>

Multiplicação JavaScript

O Operador de Multiplicação (*) multiplica números:

Multiplicando

let x = 5;
let y = 2;
let z = x * y;

Experimente você mesmo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>The * Operator</h2>

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

<script>
let x = 5;
let y = 2;
let z = x * y;
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>

Tipos de operadores JavaScript

Existem diferentes tipos de operadores JavaScript:

  • Operadores aritméticos

  • Operadores de Atribuição

  • Operadores de comparação

  • Operadores de string

  • Operadores lógicos

  • Operadores bit a bit

  • Operadores Ternários

  • Operadores de tipo

Operadores Aritméticos JavaScript

Operadores Aritméticos são usados para realizar operações aritméticas com números:

Exemplo de operadores aritméticos

let a = 3;
let x = (100 + 50) * a;

Experimente você mesmo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>Arithmetic Operations</h2>
<p>A typical arithmetic operation takes two numbers (or expressions) and produces a new number.</p>

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

<script>
let a = 3;
let x = (100 + 50) * a;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>
+

Adição

-

Subtração

*

Multiplicação

**

Exponenciação (ES2016)

/

Divisão

%

Módulo (Resto de Divisão)

++

Incremento

--

Diminuir

Observação

Os operadores aritméticos estão totalmente descritos no Capítulo Aritmética JS.

Operadores de Atribuição JavaScript

Operadores de atribuição atribuem valores a variáveis JavaScript.

O Operador de Atribuição de Adição (+=) adiciona um valor a uma variável.

Atribuição

let x = 10;
x += 5;

Experimente você mesmo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>The += Operator</h2>

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

<script>
var x = 10;
x += 5;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>
Operator Example Same As
= x = y x = y
+= x += y x = x + y
-= x -= y x = x - y
*= x *= y x = x * y
/= x /= y x = x / y
%= x %= y x = x % y
**= x **= y x = x ** y

Observação

Os operadores de atribuição estão totalmente descritos no Capítulo Atribuição JS.

Operadores de comparação JavaScript

==

igual a

===

valor igual e tipo igual

!=

não igual

!==

valor diferente ou tipo diferente

>

Maior que

<

menor que

>=

Melhor que ou igual a

<=

menos que ou igual a

?

operador ternário

Observação

Os operadores de comparação estão totalmente descritos no Capítulo Comparações JS.

Comparação de strings JavaScript

Todos os operadores de comparação acima também podem ser usados em strings:

Exemplo

let text1 = "A";
let text2 = "B";
let result = text1 < text2;

Experimente você mesmo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Operators</h1>

<p>All conditional operators can be used on both numbers and strings.</p>

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

<script>
let text1 = "A";
let text2 = "B";
let result = text1 < text2;
document.getElementById("demo").innerHTML = "Is A less than B? " + result;
</script>

</body>
</html>

Observe que as strings são comparadas em ordem alfabética:

Exemplo

let text1 = "20";
let text2 = "5";
let result = text1 < text2;

Experimente você mesmo →

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript String Operators</h1>
<p>Note that strings are compared alphabetically:</p>

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

<script>
let text1 = "20";
let text2 = "5";
let result = text1 < text2;
document.getElementById("demo").innerHTML = "Is 20 less than 5? " + result;
</script>

</body>
</html>

Adição de string JavaScript

O + também pode ser usado para adicionar (concatenar) strings:

Exemplo

let text1 = "John";
let text2 = "Doe";
let text3 = text1 + " " + text2;

Experimente você mesmo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Operators</h1>
<h2>The + Operator</h2>
<p>The + operator concatenates (adds) strings.</p>

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

<script>
let text1 = "John";
let text2 = "Doe";
let text3 = text1 + " " + text2;
document.getElementById("demo").innerHTML = text3;
</script>

</body>
</html>

O operador de atribuição += também pode ser usado para adicionar (concatenar) strings:

Exemplo

let text1 = "What a very ";
text1 += "nice day";

O resultado do text1 será:

What a very nice day

Experimente você mesmo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Operators</h1>
<h2>The += Operator</h2>
<p>The assignment operator += can concatenate strings.</p>

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

<script>
let text1 = "What a very ";
text1 += "nice day";
document.getElementById("demo").innerHTML = text1;
</script>

</body>
</html>

Observação

Quando usado em strings, o operador + é chamado de operador de concatenação.

Adicionando Strings e Números

Adicionar dois números retornará a soma, mas adicionar um número e uma string retornará uma string:

Exemplo

let x = 5 + 5;
let y = "5" + 5;
let z = "Hello" + 5;

O resultado de x,y e z será:

10
55
Hello5

Experimente você mesmo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Operators</h1>
<h2>The + Operator</h2>
<p>Adding a number and a string, returns a string.</p>

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

<script>
let x = 5 + 5;
let y = "5" + 5;
let z = "Hello" + 5;
document.getElementById("demo").innerHTML =
x + "<br>" + y + "<br>" + z;
</script>

</body>
</html>

Observação

Se você adicionar um número e uma string, o resultado será uma string!

Operadores Lógicos JavaScript

&&

lógico e

||

lógico ou

!

lógico não

Observação

Os operadores lógicos estão totalmente descritos no Capítulo Comparações JS.

Operadores de tipo JavaScript

typeof

Retorna o tipo de uma variável

instanceof

Retorna verdadeiro se um objeto for uma instância de um tipo de objeto

Observação

Os operadores de tipo são descritos completamente no capítulo Conversão de tipo JS.

Operadores JavaScript bit a bit

Os operadores de bits trabalham com números de 32 bits.

Qualquer operando numérico na operação é convertido em um número de 32 bits. O resultado é convertido novamente em um número JavaScript.

Operator Description Example Same as Result Decimal
& AND 5 & 1 0101 & 0001 0001  1
| OR 5 | 1 0101 | 0001 0101  5
~ NOT ~ 5  ~0101 1010  10
^ XOR 5 ^ 1 0101 ^ 0001 0100  4
<< left shift 5 << 1 0101 << 1 1010  10
>> right shift 5 >> 1 0101 >> 1 0010   2
>>> unsigned right shift 5 >>> 1 0101 >>> 1 0010   2

Os exemplos acima usam exemplos não assinados de 4 bits. Mas o JavaScript usa números assinados de 32 bits.
Por causa disso, em JavaScript, ~ 5 não retornará 10. Ele retornará -6.
~000000000000000000000000000101 retornará 1111111111111111111111111111010

Os operadores bit a bit são totalmente descritos no JS Capítulo bit a bit.