Meu Guia de JavaScript: Variáveis, Tipos e Operadores

Intradução

Guia Fundamental de JavaScript: Variáveis, Tipos Primitivos, Tratamento de Dados e Operadores

Para construir desde pequenas interações no front-end até aplicações complexas no back-end, dominar a base da linguagem é indispensável. Entender como o JavaScript armazena dados, interpreta tipos e realiza operações é o que separa quem apenas copia código de quem realmente compreende a lógica por trás da aplicação.

Neste artigo completo do AqGoEs DeV, vamos explorar a fundação do JS: a diferença entre as formas de declarar variáveis, os tipos primitivos de dados, como tratar e converter valores e um panorama prático sobre todos os operadores da linguagem.

1. Variáveis no JavaScript: var, let e const

No JavaScript moderno, existem três palavras-chave para armazenar valores na memória. A escolha da palavra correta afeta o escopo e a mutabilidade da sua variável.

• var (Escopo Global/Função): A forma antiga de declarar variáveis. Sofre de hoisting (elevação) e não respeita o escopo de bloco ({}), o que pode gerar erros silenciosos. Evite utilizar no JS moderno.
• let (Escopo de Bloco): Permite reatribuição de valores e respeita o escopo de bloco. Ideal para contadores ou valores que mudam durante a execução.
• const (Escopo de Bloco): Cria referências constantes que não podem ser reatribuídas. Deve ser a sua escolha padrão para declarar variáveis.

const nome = 'Alan'; // Não pode ser alterado
let idade = 28;     // Pode ser reatribuído
idade = 29;

if (true) {
  let bloco = 'Visível apenas aqui';
}

2. Tipos Primitivos de Dados

Os tipos primitivos representam os valores mais básicos da linguagem. Eles são imutáveis e passados por valor.

• String: Textos delimitados por aspas simples ('), aspas duplas (") ou template literals (` `).
• Number: Representa números inteiros e decimais (ponto flutuante).
• Boolean: Aceita apenas dois valores: true (verdadeiro) ou false (falso).
• Null: Ausência intencional de valor.
• Undefined: Variável declarada, mas que ainda não teve um valor atribuído.
• Symbol: Identificador único e imutável (introduzido no ES6).
• BigInt: Para manipular números inteiros de precisão arbitrária maior que 253−1.

const linguagem = "JavaScript"; // String
const versao = 2026;            // Number
const ativo = true;             // Boolean
let resposta;                   // Undefined
const nulo = null;              // Null

3. Tratamento de Dados e Conversão de Tipos (Casting)

Muitas vezes, dados capturados em formulários HTML chegam ao JavaScript no formato de String. Para realizar operações matemáticas, precisamos converter (cast) esses dados.

Conversão de String para Número

• Number(valor): Converte para número inteiro ou decimal.
• parseInt(valor): Converte a string para um número inteiro.
• parseFloat(valor): Converte a string mantendo as casas decimais.

Conversão para String

• String(valor) ou valor.toString(): Converte qualquer tipo para texto.

Manipulação e Formatação Prática

• Template Literals: Facilita a interpolação de variáveis usando `Texto ${variavel}`.
• Casas Decimais: .toFixed(2) limita o número de casas decimais.
• Localização Moeda: .toLocaleString('pt-BR', { style: 'currency', currency: 'BRL' }) formata valores numéricos para o padrão monetário brasileiro.

// Exemplo prático de tratamento
const inputForm = “49.90”;
const preco = Number(inputForm); // Converte para Number: 49.9

console.log(Valor: ${preco.toFixed(2)}); // “Valor: 49.90”
console.log(preco.toLocaleString(‘pt-BR’, { style: ‘currency’, currency: ‘BRL’ })); // “R$ 49,90”

4. Guia Definitivo dos Operadores do JavaScript

Os operadores permitem manipular e comparar dados dentro do código.

A. Operadores Aritméticos

Servem para realizar cálculos matemáticos:

• + (Adição / Concatenação)
• - (Subtração)
• * (Multiplicação)
• / (Divisão)
• % (Módulo – Resto da Divisão)
• ** (Exponenciação)

B. Operadores de Atribuição

Atribuem valores e realizam operações simplificadas:

• = (Atribuição simples)
• +=, -=, *=, /= (Atribuição com operação)

C. Operadores Relacionais e de Igualdade

Comparam valores e retornam um valor booleano (true ou false):

• > (Maior que) e < (Menor que)
• == (Igualdade simples – compara apenas o valor com conversão automática)
• === (Igualdade estrita – compara valor e tipo de dado)
• != (Diferente de) e !== (Estritamente diferente)

D. Operadores Lógicos

Combinam expressões booleanas:

• && (E / AND) — Retorna true apenas se todas as condições forem verdadeiras.
• || (OU / OR) — Retorna true se pelo menos uma condição for verdadeira.
• ! (NÃO / NOT) — Inverte o valor booleano.

E. Operador Ternário

Uma forma enxuta de escrever um bloco if...else de linha única: condicao ? valorSeVerdadeiro : valorSeFalso

const idade = 18;
const podeDirigir = idade >= 18 ? "Sim" : "Não"; // "Sim"

Resumo Visual dos Operadores de Comparação

Operador	Nome	Exemplo	Resultado
==	Igualdade ampla	‘5’ == 5	true (Converte a string antes de comparar)
===	Igualdade estrita	‘5’ === 5	false (Tipos diferentes: String vs Number)
!=	Diferença ampla	‘5’ != 5	false
!==	Diferença estrita	'5' !== 5	true

Destaques de Boas Práticas

💡 Dica de Ouro: Sempre utilize a igualdade estrita (===) e a diferença estrita (!==) no seu dia a dia. Evitar a coerção automática de tipos promovida pelos operadores == e != elimina uma das maiores fontes de bugs imprevisíveis em aplicações JavaScript.

Conclusão

Compreender variáveis, tipos primitivos, tratamento de dados e o funcionamento dos operadores é a base para escrever um código limpo, performático e sem bugs. Ao dominar esses conceitos fundamentais, você estará pronto para avançar para estruturas condicionais, laços de repetição e manipulação do DOM no front-end.

Qual dessas etapas você achou mais interessante: a View Transitions API nos temas ou a precisão dos operadores estritos (===)? Deixe seu comentário e compartilhe sua experiência abaixo!