Variáveis e tipos de dados

Declarar

const nome = "Maria";
let contador = 0;

• const: o valor não pode ser reatribuído
• let: pode

Use const por padrão. Passe para let só quando precisar mudar o valor. Isso não é preciosismo: uma variável que não muda é uma coisa a menos para acompanhar quando você estiver procurando um defeito.

const precoBase = 12.5; // não muda
let total = 0; // vai somando

total = total + precoBase; // ok
precoBase = 15; // TypeError: Assignment to constant variable

const com objeto e lista

const produto = { nome: "Farinha", preco: 12.5 };
produto.preco = 13.0; // permitido
produto = {}; // TypeError

const impede reatribuir a variável, e não modificar o conteúdo dela. A caixa é a mesma; o que está dentro pode mudar.

Os tipos

const texto = "Benjamin Constant"; // string
const numero = 42; // number
const decimal = 12.5; // number também
const verdadeiro = true; // boolean
const vazio = null; // null
let indefinido; // undefined

typeof mostra o tipo:

console.log(typeof "texto"); // → "string"
console.log(typeof 42); // → "number"
console.log(typeof true); // → "boolean"
console.log(typeof undefined); // → "undefined"
console.log(typeof null); // → "object"  ← esquisito, e conhecido

O último é um defeito histórico da linguagem, dos anos 90, mantido porque consertá-lo quebraria código existente. Não é erro seu.

null e undefined

let telefone; // undefined: nunca recebeu valor
const email = null; // null: vazio de propósito

undefined é o que a linguagem põe quando não há valor. null é o que você põe para dizer "aqui não tem nada, e isso é intencional".

Num formulário: um campo que a pessoa não preencheu pode chegar como null; uma propriedade que nem existe no objeto vem undefined.

Texto

const simples = "aspas simples";
const duplas = "aspas duplas";
const template = `crase`;

A crase é diferente das outras duas: ela permite interpolação.

const produto = "Farinha";
const preco = 12.5;
const quantidade = 3;

// Sem template
const linha1 = produto + ": " + quantidade + " x R$ " + preco;

// Com template - mais legível
const linha2 = `${produto}: ${quantidade} x R$ ${preco}`;

// E aceita conta dentro
const linha3 = `${produto}: R$ ${(preco * quantidade).toFixed(2)}`;
console.log(linha3); // → Farinha: R$ 37.50

Também aceita várias linhas:

const recado = `Feira do produtor
Quarta e sábado, das 5h às 11h
Orla, ao lado do porto`;

Números, e o problema do dinheiro

Só existe um tipo numérico:

const inteiro = 42;
const decimal = 12.5;
const negativo = -7;

E há uma armadilha que todo mundo encontra:

console.log(0.1 + 0.2); // → 0.30000000000000004
console.log(0.1 + 0.2 === 0.3); // → false

Não é defeito do JavaScript: é como todo computador guarda decimais em binário. Mas em dinheiro isso se acumula:

// Frágil
const preco = 12.5;
const total = preco * 3; // 37.5 - desta vez deu certo

// Sólido: centavos inteiros
const precoEmCentavos = 1250;
const totalEmCentavos = precoEmCentavos * 3; // 3750, exato

// Divide por 100 só na hora de mostrar
const paraMostrar = (totalEmCentavos / 100).toFixed(2); // "37.50"

Formatar para quem lê

const valorEmCentavos = 3750;

const formatado = (valorEmCentavos / 100).toLocaleString("pt-BR", {
  style: "currency",
  currency: "BRL",
});

console.log(formatado); // → R$ 37,50

toLocaleString põe a vírgula decimal, o ponto de milhar e o símbolo: do jeito que se escreve em português.

Nomes de variável

// Ruim
const x = 12.5;
const dados = ["Ana", "João"];
const flag = true;

// Bom
const precoDoQuilo = 12.5;
const nomesDosAlunos = ["Ana", "João"];
const matriculaAberta = true;

A convenção é camelCase: primeira palavra minúscula, as seguintes com inicial maiúscula. Nomes de booleano costumam começar com e, tem ou esta.

Exercícios

1. Declare const para o nome de um produto e o preço em centavos.
2. Use template literal para montar "Farinha: R$ 12,50 o quilo".
3. Rode 0.1 + 0.2 no console e veja o resultado.
4. Calcule o total de 3,5 kg a R$ 12,50 usando centavos, e formate com toLocaleString.
5. Tente reatribuir uma const e leia o erro.
6. Declare uma variável sem valor e mostre typeof dela.

Referências

• Variáveis - MDN - declaração e escopo
• Tipos de dados - MDN - os tipos da linguagem
• toLocaleString - MDN - formatar número e moeda