Introdução
Neste laboratório, trabalharemos em um exercício de programação JavaScript que envolve a substituição ou adição de valores em um array com base em uma função de comparação. Através deste exercício, você aprenderá como usar o operador spread (...), Array.prototype.findIndex(), Array.prototype.push(), e Array.prototype.splice() para manipular arrays em JavaScript. Este laboratório o ajudará a aprimorar suas habilidades em trabalhar com arrays e funções em JavaScript.
Como Substituir ou Adicionar um Valor em um Array
Para substituir um item em um array ou adicioná-lo se ele não existir, siga estes passos:
- Use o operador spread (
...) para criar uma cópia rasa (shallow copy) do array. - Use
Array.prototype.findIndex()para encontrar o índice do primeiro elemento que satisfaz a função de comparação fornecidacompFn. - Se nenhum elemento for encontrado, use
Array.prototype.push()para adicionar o novo valor ao array. - Caso contrário, use
Array.prototype.splice()para substituir o valor no índice encontrado pelo novo valor.
Aqui está um exemplo de como implementar essa funcionalidade:
const replaceOrAppend = (arr, val, compFn) => {
const res = [...arr];
const i = arr.findIndex((v) => compFn(v, val));
if (i === -1) res.push(val);
else res.splice(i, 1, val);
return res;
};
Você pode usar esta função com um array de objetos assim:
const people = [
{ name: "John", age: 30 },
{ name: "Jane", age: 28 }
];
const jane = { name: "Jane", age: 29 };
const jack = { name: "Jack", age: 28 };
replaceOrAppend(people, jane, (a, b) => a.name === b.name);
// [ { name: 'John', age: 30 }, { name: 'Jane', age: 29 } ]
replaceOrAppend(people, jack, (a, b) => a.name === b.name);
// [
// { name: 'John', age: 30 },
// { name: 'Jane', age: 28 },
// { name: 'Jack', age: 28 }
// ]
Resumo
Parabéns! Você concluiu o laboratório de Substituição ou Adição de Valor em Array. Você pode praticar mais laboratórios no LabEx para aprimorar suas habilidades.