Métodos Imutáveis em Arrays JS: Manipulação Segura com with, toSorted e toSpliced

Alterar o array original diretamente via mutação pode provocar bugs sutis de efeito colateral em aplicações JavaScript complexas. O uso dos métodos nativos .with(), .toSorted() e .toSpliced() resolve esse problema ao gerar automaticamente uma cópia modificada do array, preservando a estrutura original intacta.

JavaScript

/**
 * Demonstra a manipulação imutável de dados em um array de dados.
 */
function manipularArraySemMutar() {
  const linguagens = ['Python', 'Java', 'C++', 'JavaScript'];

  // 1. .with(): Substitui o elemento em um índice específico
  const comRust = linguagens.with(1, 'Rust'); // Substitui 'Java' por 'Rust'

  // 2. .toSorted(): Ordena os elementos sem alterar a lista original
  const ordenadas = linguagens.toSorted();

  // 3. .toSpliced(): Remove ou insere elementos por índice
  const semCpp = linguagens.toSpliced(2, 1, 'Go'); // Remove 'C++' e insere 'Go'

  return { original: linguagens, comRust, ordenadas, semCpp };
}

// --- Exemplo Prático de Uso ---
const resultado = manipularArraySemMutar();

console.log('Original (Intacto):', resultado.original);
// ['Python', 'Java', 'C++', 'JavaScript']

console.log('Substituição (.with):', resultado.comRust);
// ['Python', 'Rust', 'C++', 'JavaScript']

console.log('Ordenação (.toSorted):', resultado.ordenadas);
// ['C++', 'Java', 'JavaScript', 'Python']

console.log('Remoção/Inserção (.toSpliced):', resultado.semCpp);
// ['Python', 'Java', 'Go', 'JavaScript']

Pontos-chave

• Garantia de Imutabilidade Real: Diferente dos equivalentes mutáveis (sort, splice ou atribuição direta por índice), estas funções sempre retornam uma nova cópia do array.
• Índices Negativos no .with(): Aceita posições negativas para alterar elementos contados a partir do final (ex: .with(-1, 'Novo') altera o último item).
• Paridade de Sintaxe com Métodos Antigos: .toSorted() aceita a mesma função de comparação que .sort(), e .toSpliced() utiliza os mesmos parâmetros de posição, contagem e novos itens que .splice().
• Compatibilidade e Ecossistema (ES2023): Suportados nativamente no Node.js (v20+) e browsers modernos, sendo ideais para gerenciamento de estado previsível em ecossistemas como React e Redux.