Meu Aprendizado • JavaScript

Começando a Entender

Antes dessas aulas, eu sabia criar variáveis e pedir dados com prompt. Mas agora aprendi algo muito mais poderoso: fazer o código tomar decisões sozinho.

A ideia central que entendi é: uma condicional é como fazer uma pergunta ao código. "Se isso acontecer, faça aquilo. Se não, faça outra coisa." É assim que o JavaScript ganha inteligência.

Tomando Decisões no Código

Percebi que estruturas condicionais são o coração de qualquer programa. Elas permitem que eu crie lógica, regras e comportamentos diferentes baseados em situações.

O professor Luan explicou com um exemplo que fez sentido: quando você sobe na balança e não gosta do número, você decide começar uma dieta. Isso é uma decisão baseada em uma condição. No código, fazemos exatamente isso com if e else.

Meu Primeiro IF

A primeira coisa que aprendi foi a estrutura básica do if. É surpreendentemente simples, mas super poderoso.

let numero1 = 4;
if (numero1 > 2) {
    console.log("O número é maior que 2");
}

Esse foi meu primeiro código de decisão! Basicamente, estou perguntando: "esse número é maior que 2?". Se a resposta for sim (true), a mensagem aparece. Se for não (false), nada acontece.

Comparando Valores

Descobri que para fazer essas perguntas ao código, eu preciso usar operadores de comparação. Eles sempre retornam true ou false.

== != > < >= <=

console.log(2 + 2 == 4); // true
console.log(2 + 2 == 5); // false

Testei muito isso no console. É fascinante como o JavaScript responde verdadeiro ou falso para qualquer comparação que eu faça!

Múltiplas Condições

Depois de entender o if básico, aprendi que posso encadear várias condições usando else if e else.

let numero = parseInt(prompt("Digite um número:"));
if (numero > 5) {
    console.log("O número é maior que 5");
} else if (numero < 5) {
    console.log("O número é menor que 5");
} else {
    console.log("O número é igual a 5");
}

Esse código cobre todas as possibilidades! O número pode ser maior, menor ou igual a 5. Aprendi que o else final é como um "caso contrário" - captura tudo que não foi pego antes.

Debugando no Console

Uma das coisas mais úteis que aprendi foi usar o console do navegador para testar e depurar meu código.

Como abrir o console:

Windows: Ctrl + Shift + J
Mac: Cmd + Option + J

O console é meu melhor amigo agora. Sempre que algo não funciona, eu jogo um console.log() para ver o que está acontecendo.

Salvando Dados no Navegador

Fiquei impressionado quando aprendi sobre localStorage. Você pode salvar informações que ficam guardadas mesmo depois de fechar a página!

Para salvar

localStorage.setItem("nome", "Gleidson");

Para recuperar

let nome = localStorage.getItem("nome");
console.log(nome); // Gleidson

Isso abre muitas possibilidades! Posso criar sistemas de login simples, salvar preferências do usuário, e muito mais.

Criando um Relógio Dinâmico

Aprendi sobre setInterval, uma função que executa código repetidamente em intervalos definidos. Usei isso para criar um relógio que atualiza a cada segundo!

Relógio (atualiza a cada 1s):

--:--:--

function mostrarHora() {
    let agora = new Date();
    document.getElementById("relogio").innerHTML = agora.toLocaleTimeString();
}
setInterval(mostrarHora, 1000);

Ver esse relógio funcionando foi um momento "uau" para mim. O setInterval executa a função mostrarHora a cada 1000 milissegundos (1 segundo).

Operadores que Conheci

Durante as aulas, vi vários tipos de operadores. Cada um tem seu propósito específico.

Operadores de Atribuição - para dar valores às variáveis

let numero = 2;
numero += 2; // agora numero vale 4 (mesma coisa que numero = numero + 2)

Incremento e Decremento - atalhos práticos

let numero = 2;
numero += 2; // número agora é 4
numero -= 2; // número agora é 2

Operadores Aritméticos - matemática básica

+ - * / %

let soma = 2 + 3; // 5
let subtracao = 5 - 2; // 3
let multiplicacao = 2 * 3; // 6
let divisao = 6 / 2; // 3
let modulo = 5 % 2; // 1 (resto da divisão)

Operadores de Comparação - testei bastante estes!

console.log(2 == "2");  // true (compara só o valor)
console.log(2 === "2"); // false (compara valor E tipo)
console.log(2 != "2");  // false
console.log(2 !== "2"); // true
console.log(2 > 1);     // true
console.log(2 < 3);     // true
console.log(2 >= 2);    // true
console.log(2 <= 1);    // false

Importante: Aprendi a diferença entre == e ===. O duplo igual compara só valores, o triplo compara valor E tipo. É melhor usar o triplo para evitar bugs!

Operadores Lógicos - para combinar condições

&& || !

let a = true;
let b = false;

console.log(a && b); // false (E - ambos precisam ser true)
console.log(a || b); // true (OU - pelo menos um precisa ser true)
console.log(!a);     // false (NÃO - inverte o valor)

Os operadores lógicos são poderosos! Posso fazer perguntas complexas tipo: "a idade é maior que 18 E tem CNH?" usando (idade > 18 && temCNH)

Switch - Uma Alternativa

Quando tenho muitos valores específicos para checar, aprendi que o switch é mais organizado que vários if encadeados.

Estrutura básica

switch (expressao) {
    case valor1:
        // Código se expressao === valor1
        break;
    case valor2:
        // Código se expressao === valor2
        break;
    default:
        // Código se nenhum case foi atendido
}

Exemplo prático que testei

let modo = prompt("Digite um modo: dark, red ou blue:");

switch (modo) {
    case "dark":
        document.body.style.backgroundColor = "black";
        document.body.style.color = "white";
        break;
    case "red":
        document.body.style.backgroundColor = "red";
        document.body.style.color = "white";
        break;
    case "blue":
        document.body.style.backgroundColor = "blue";
        document.body.style.color = "white";
        break;
    default:
        document.body.style.backgroundColor = "pink";
        document.body.style.color = "black";
}

Aprendi da maneira difícil: o break é essencial! Sem ele, o JavaScript continua executando os próximos cases mesmo depois de encontrar uma correspondência. Foi um bug que passei um tempão procurando até o professor explicar!

Ternário - O IF Compacto

O operador ternário foi uma das últimas coisas que aprendi. É uma forma super compacta de escrever um if...else simples.

Sintaxe

condição ? valorSeVerdadeiro : valorSeFalso

Exemplo básico

let modo = "dark";
let mensagem = modo ? "Está definida" : "Não está definida";
console.log(mensagem); // "Está definida"

Comparando as duas formas

Com if...else tradicional:

let modo = "dark";
let mensagem;
if (modo) {
    mensagem = "Está definida";
} else {
    mensagem = "Não está definida";
}
console.log(mensagem);

Com ternário:

let modo = "dark";
let mensagem = modo 
    ? "Está definida" 
    : "Não está definida";
console.log(mensagem);

Valores falsos e verdadeiros

Uma coisa importante que aprendi: nem tudo no JavaScript é true ou false explicitamente, mas tudo pode ser avaliado como verdadeiro ou falso.

Valores "falsos" (falsy):

false 0 "" null undefined NaN

Valores "verdadeiros" (truthy):

"texto" 123 [] {}

console.log(Boolean(0));       // false
console.log(Boolean(""));      // false
console.log(Boolean("texto")); // true
console.log(Boolean(123));     // true
console.log(Boolean([]));      // true (array vazio é true!)
console.log(Boolean({}));      // true (objeto vazio é true!)

Isso me pegou de surpresa no começo. Um array vazio [] ou objeto vazio {} são considerados verdadeiros! Só preciso lembrar dos 6 valores que são falsos.

Exemplos mais elaborados

// Checando igualdade
let modo = "dark";
let mensagem = (modo === "dark") 
    ? "Modo escuro ativado" 
    : "Modo claro ativado";
console.log(mensagem); // "Modo escuro ativado"

// Ternário aninhado (funciona, mas pode ficar confuso)
let numero = 5;
let tipoNumero = (numero > 0) 
    ? "Positivo" 
    : (numero < 0) 
        ? "Negativo" 
        : "Zero";
console.log(tipoNumero); // "Positivo"

O professor disse que ternário aninhado funciona, mas não é muito legível. Para casos complexos, é melhor usar if...else if...else normal.

O que Tirei Disso Tudo

Essas aulas mudaram completamente minha forma de pensar sobre programação. Antes, meu código era linear - fazia uma coisa após a outra. Agora ele pode tomar decisões!

Meus principais aprendizados:

Condicionais são a base da lógica de programação
Existem várias formas de escrever a mesma lógica (if, switch, ternário)
O console é meu melhor amigo para debug
Operadores lógicos permitem criar condições complexas
localStorage e setInterval abrem um mundo de possibilidades

O professor Luan sempre diz: "Repetição é a mãe do domínio". Então agora vou praticar criando pequenos projetos usando tudo que aprendi. Calculadoras, jogos de adivinhação, sistemas de login simples... as possibilidades são infinitas!

O que Aprendi sobre JavaScript nas Aulas do Professor Luan

Começando a Entender

Tomando Decisões no Código

Meu Primeiro IF

Comparando Valores

Múltiplas Condições

Debugando no Console

Salvando Dados no Navegador

Criando um Relógio Dinâmico

Operadores que Conheci

Switch - Uma Alternativa

Ternário - O IF Compacto

O que Tirei Disso Tudo

Sobre este Projeto