Se você escrever uma expressão com vários operadores em JavaScript, como o JavaScript decide qual avaliar primeiro? É aqui que a precedência do operador entra em ação. Vamos explorar a precedência dos operadores em detalhes com exemplos de código e também o que acontece quando os operadores têm a mesma precedência. A precedência do operador determina a ordem em que as operações são avaliadas em uma expressão. Operadores com precedência mais alta são avaliados antes daqueles com precedência mais baixa. Pense na precedência de operadores como na matemática, onde divisão e multiplicação acontecem antes de adição e subtração. Sem seguir esta regra, equações básicas lhe dariam a resposta errada. JavaScript funciona da mesma maneira. Ele tem suas próprias regras para quais operadores vêm primeiro, segundo e assim por diante. Por exemplo, dê uma olhada na expressão abaixo:

const result = 2 + 3 * 4;

console.log(result); // 14

Se o JavaScript avaliasse essa expressão da esquerda para a direita, você esperaria 2 + 3 = 5 e depois 5 * 4 = 20. Mas como a multiplicação tem precedência maior que a adição, o JavaScript avalia primeiro a parte 3 * 4, resultando em 2 + 12 = 14. Às vezes, você pode querer que certas partes da sua expressão sejam executadas primeiro, independentemente das regras de precedência. Você pode usar parênteses, (), para fazer isso. Qualquer coisa dentro de parênteses é avaliada primeiro, não importa o que seja. Vamos fazer a parte 2 + 3 do exemplo anterior ser avaliada primeiro:

const result = (2 + 3) * 4;

console.log(result); // 20

No exemplo acima, os parênteses forçam o JavaScript a avaliar 2 + 3 primeiro e depois multiplicar o resultado por 4. Isto lhe dá 20 em vez de 14. O operador de divisão tem mais precedência do que adição ou subtração também:

const result = 2 + 6 / 3;

console.log(result); // 4

Se o JavaScript avaliasse essa expressão da esquerda para a direita, você poderia esperar 2 + 6 = 8 e depois 8 / 3 = 2.67. Mas como a divisão tem precedência maior que a adição, o JavaScript avalia a divisão primeiro: 6 / 3 = 2 e depois soma 2 + 2, dando o resultado 4. Então, tanto na multiplicação quanto na divisão, essas operações sempre ocorrerão antes da adição e subtração a menos que você use parênteses para alterar a ordem. O que acontece se os operadores tiverem a mesma precedência? JavaScript usa associatividade para determinar a ordem de avaliação deles. Associatividade é o que diz ao JavaScript se deve avaliar os operadores da esquerda para a direita ou da direita para a esquerda. Para a maioria dos operadores como adição e multiplicação, a associatividade é da esquerda para a direita. Então, o JavaScript processa esses do lado mais à esquerda da expressão para o direito:

const result = 10 - 2 + 3;

console.log(result); // 11

Primeiro, 10 - 2 = 8, depois 8 + 3 = 11. JavaScript executa da esquerda para a direita neste caso. Alguns operadores, como atribuição (=), são associativos da direita para a esquerda. Isso significa que o lado direito da expressão é avaliado primeiro:

let a, b;
a = b = 5;

console.log(a); // 5
console.log(b); // 5
console.log(a + b); // 10

No exemplo acima, JavaScript atribui 5 a b primeiro, depois atribui b (que agora é 5) a a. O operador de exponenciação também é associativo da direita para a esquerda:

const result = 2  3  2;

console.log(result); // 512

Primeiro, JavaScript avalia 3 2, que é igual a 9, depois, ele avalia 2 9, que é igual a 512. Se o operador de exponenciação tivesse associatividade da esquerda para a direita, o JavaScript teria calculado 2 3 primeiro para obter 8 e depois 8 2 para obter 64.