1. Parâmetros de Função

JavaScript permite que as funções aceitem um número variável de argumentos, o que é útil em cenários onde o número de entradas pode mudar. A palavra-chave arguments dentro de uma função é um objeto semelhante a um array que contém todos os argumentos passados para a função.

Exemplo 1: Soma de Argumentos

Este exemplo demonstra como somar todos os argumentos passsados para uma função.

function calcularSoma() {
 let total = 0;
 // Itera sobre todos os argumentos passados para a função
 for (let i = 0; i < arguments.length; i++) {
   total += arguments[i];
 }
 return total;
}

// Exemplo de uso com vários argumentos
alert(calcularSoma(10, 5, 20, 15, 30));
 

Exemplo 2: Função para Manipulação de Estilo CSS

Esta função atua como um setter/getter para propriedades CSS de um elemento. Ela verifica o número de argumentos para determinar se deve definir um valor ou retornar o valor atual de uma propriedade.

function gerenciarEstilo(elemento, propriedade, valor) {
 if (arguments.length === 2) { // Getter: retorna o valor da propriedade
   return elemento.style[propriedade];
 } else { // Setter: define o valor da propriedade
   elemento.style[propriedade] = valor;
 }
}

window.onload = function() {
 const meuDiv = document.getElementById('divTeste');

 // Exemplo de getter
 alert(gerenciarEstilo(meuDiv, 'width'));

 // Exemplo de setter
 gerenciarEstilo(meuDiv, 'backgroundColor', 'blue');
};
 

Para obter estilos CSS que não foram definidos diretamente no atributo 'style' de um elemento (estilos não-inline), é necessário usar métodos específicos do navegador. Estes métodos não podem ser usados para definir estilos.

• Para Internet Explroer: elemento.currentStyle[nomeAtributo]
• Para Chrome/Firefox: window.getComputedStyle(elemento, null)[nomeAtributo]

Exemplo: Obter Estilo Calculado

Esta função abstrai a diferença entre os navegadores para obter o valor computado de uma propriedade CSS. Note que para propriedades compostas como 'background', é mais preciso solicitar propriedades específicas como 'backgroundColor'.

function obterEstilo(elemento, nomePropriedade) {
 if (elemento.currentStyle) { // IE
   return elemento.currentStyle[nomePropriedade];
 } else { // Chrome / Firefox
   // O segundo argumento 'null' indica que não há pseudo-elemento
   return window.getComputedStyle(elemento, null)[nomePropriedade];
 }
}

window.onload = function() {
 const meuDivEstilo = document.getElementById('divEstilo');
 alert(obterEstilo(meuDivEstilo, 'backgroundColor'));
};
 

3.1. Adicionar e Remover Elementos

• Adicionar:
  • push(elemento): Adiciona um ou mais elementos ao final do array.
  • unshift(elemento): Adiciona um ou mais elementos ao início do array.
• Remover:
  • pop(): Remove e retorna o último elemento do array.
  • shift(): Remove e retorna o primeiro elemento do array.

3.2. Inserir e Remover com splice()

O método splice() é poderoso para modificar arrays diretamante, permitindo a remoção e/ou inserção de elementos em uma posição específica.

• Sintaxe geral: splice(indiceInicial, numeroDeElementos, novoElemento1, novoElemento2, ...)
• Para remover: splice(indiceInicial, numeroDeElementos)
• Para inserir: splice(indiceInicial, 0, novoElemento1, novoElemento2, ...)
• Para substituir: splice(indiceInicial, numeroDeElementos, novoElemento1, ...) (remove numeroDeElementos e insere os novos elementos)

Exemplo de splice()

let meuArray = [10, 20, 30, 40, 50];

// Substitui 2 elementos a partir do índice 2 ('30', '40') por 'a', 'b'
meuArray.splice(2, 2, 'a', 'b');

alert(meuArray); // Saída: 10,20,a,b,50
 

3.3. Ordenar e Converter Arrays

• Ordenar:
  • sort([funcaoComparacao]): Ordena os elementos do array. Se uma função de comparação não for fornecida, os elementos são ordenados como strings. Para ordenação numérica correta, uma função de comparação é necessária.
• Converter:
  • concat(array2, array3, ...): Junta dois ou mais arrays, retornando um novo array.
  • join(separador): Une todos os elementos de um array em uma string, usando um separador especificado. O método split() faz o processo inverso, convertendo uma string em um array.

Exemplo de Ordenação de String

let palavras = ['float', 'width', 'alpha', 'zoom', 'left'];
palavras.sort();
alert(palavras); // Saída: alpha,float,left,width,zoom
 

Exemplo de Ordenação Numérica

let numeros = [12, 8, 99, 19, 112];

// Função de comparação para ordenação numérica crescente
numeros.sort(function(a, b) {
 return a - b;
});

alert(numeros); // Saída: 8,12,19,99,112