Estruturas de Repetição, Arrays e Funções em JavaScript

Laços de Repetição com for

O laço for é uma estrutura fundamental para executar blocos de código repetidamente. Sua sintaxe clara reúne inicialização, condição e incremento em um único local:

for (let inicio = 0; inicio < limite; inicio++) {
    // bloco de código
}

Exemplo prático que imprime uma mensagem três vezes:

for (let contador = 1; contador <= 3; contador++) {
    document.write('Salário acima da média');
}

Controle de Fluxo em Laços

  • continue: interrompe a iteração atual e passa para a próxima. Útil para ignorar certos valores.
  • break: encerra completamente o laço. Ideal quando o objetivo já foi alcançado.

Para criar laços infinitos (que exigem break para sair), use:

while (true) { ... }
// ou
for (;;) { ... }

Use for quando o número de repetições for conhecido; caso contrário, prefira while.

Laços Aninhados

É possível aninhar for para operações bidimensionais, como imprimir uma grade:

for (let linha = 1; linha <= 5; linha++) {
    for (let coluna = 1; coluna <= 5; coluna++) {
        document.write('★');
    }
    document.write('<br>');
}

Trabalhando com Arrays

Um array é uma estrutura que armazena múltiplos valores em ordem, acessíveis por um índice numérico (começando do 0).

Criação de Arrays

// Forma literal (recomendada)
const nomes = ['Ana', 'Bruno', 'Carlos'];

// Usando construtor
const frutas = new Array('Maçã', 'Banana');

Acesso aos Elementos

O acesso é feito via colchetes e índice:

nomes[0]; // Retorna 'Ana'
nomes[1]; // Retorna 'Bruno'

Cada item no array é chamado de elemento. O total de elementos é obtido com array.length.

Percorrendo Arrays

Utilize for para iterar sobre todos os elementos:

const numeros = [10, 20, 30, 40, 50];
for (let i = 0; i < numeros.length; i++) {
    document.write(numeros[i]);
}

Manipulação de Dados em Arrays

Arrays permitem operações comuns: adicionar, remover, modificar e buscar.

Adicionando Itens

  • push(): adiciona ao final.
  • unshift(): adiciona ao início.
const cores = ['vermelho', 'verde'];
cores.push('azul');     // ['vermelho', 'verde', 'azul']
cores.unshift('amarelo'); // ['amarelo', 'vermelho', 'verde', 'azul']

Removendo Itens

  • pop(): remove do final.
  • shift(): remove do início.
  • splice(): remove itens a partir de uma posição específica.
const lista = ['a', 'b', 'c', 'd'];
lista.pop();      // ['a', 'b', 'c']
lista.shift();    // ['b', 'c']
lista.splice(1, 1); // Remove 1 elemento a partir do índice 1 → ['b']

Ordenação de Arrays

O método sort() permite ordenar elementos numericamente com uma função de comparação:

const valores = [4, 2, 5, 1, 3];

// Ordem crescente
valores.sort((x, y) => x - y);
console.log(valores); // [1, 2, 3, 4, 5]

// Ordem decrescente
valores.sort((x, y) => y - x);
console.log(valores); // [5, 4, 3, 2, 1]

Fundamentos de Funções

Funções são blocos de código reutilizáveis projetados para realizar tarefas específicas.

Declaração e Chamada

function saudar() {
    document.write('Olá!');
}

saudar(); // Executa a função
saudar(); // Pode ser chamada múltiplas vezes

Nomes de funções devem seguir o padrão camelCase e começar com um verbo, como calcularTotal() ou exibirMensagem().

Parâmetros e Argumentos

Parâmetros (formais) definem os dados esperados; argumentos (reais) são os valores fornecidos na chamada:

function calcularArea(base, altura) {
    document.write(base * altura);
}

calcularArea(5, 3); // base=5, altura=3

Se um parâmetro não for fornecido, seu valor será undefined. Para evitar erros, defina valores padrão:

function somar(a = 0, b = 0) {
    return a + b;
}

Retorno de Valores

Use return para devolver um resultado ao código chamador:

function somar(x, y) {
    return x + y;
}

const resultado = somar(10, 20);
document.write(resultado); // 30

Após return, o restante do código na função é ignorado. Se não houver return, a função retorna undefined.

Escopo de Variáveis

Existem dois tipos principais de escopo:

  • Variável global: declarada fora de funções, acessível em qualquer lugar.
  • Variável local: declarada dentro de uma função, acessível apenas nela.

A regra de busca segue o princípio do mais próximo: o interpretador procura primeiro na variável local, depois nas superiores e, por fim, na global.

let a = 1;
function fn1() {
    let a = 2;
    let b = '22';
    function fn2() {
        let a = 3;
        function fn3() {
            let a = 4;
            console.log(a); // 4
            console.log(b); // '22' (encontrado em fn1)
        }
        fn3();
    }
    fn2();
}
fn1();

Funções Anônimas

São funções sem nome, usadas geralmente em atribuições ou execuções imediatas:

// Expressão de função
const exibir = function() {
    document.write('Executando...');
};

// Chamada
exibir();

// IIFE (Immediately Invoked Function Expression)
(function() {
    console.log('Esta função roda imediatamente.');
})();

Tags: javascript for-loop Arrays functions scope

Publicado em 8-10 14:28