Su camino es correcto en caso de que no esté usando una matriz multidimensional, pero aquí está clonando una matriz multidimensional, y al usar el operador =, ¡asignará objetos/matrices por referencia en lugar de por valor! Eso significa que cada vez que modifique cualquiera de los dos objetos, afectará el valor de ambos.

Una buena manera de resolver esto es creando un clon profundo haciendo algo como esto

 const tempArray = JSON.parse(JSON.stringify([...data])) tempArray.map((item) => delete item.id)

Esto sucede porque está creando una nueva matriz, pero los objects de esa matriz no se copian profundamente. En cambio, representan solo una referencia a los mismos objetos que en los datos.

Debido a que ambas referencias apuntan al mismo objeto, si elimina una propiedad de objeto de los objetos tempArray , en realidad la está eliminando de los objetos de data .

Si desea resolver esto, debe destruir la referencia haciendo una copia profunda de los objetos de la matriz de data .

Aquí hay un ejemplo de cómo hacerlo:

 export const Test = () => { const [data, setData] = useState([{ id: 1, description: "Test Data" }]); const manipulateData = (data) => { let tempArray = data.map((item) => {item.description}); //this will create an array with new object, and destroy the reference to the objects of data. }; return ( <> <h1>Testing Data</h1> {manipulateData(data)} {console.log(data)} </> ); };

Además, en lugar de eliminar una propiedad, es mejor elegir la que necesita.

El siguiente código:

 let tempArray = [...data];

solo copia superficialmente su matriz data , lo que significa que cualquiera de los objetos dentro de tempArray se refiere a los mismos objetos en la memoria que están dentro de la matriz data . Esto significa que cuando recorre sus objetos con .map() , cada item también se refiere a un objeto de data , lo que da como resultado que los objetos en data cambien cuando usa delete item.id .

Actualmente, está utilizando .map() solo para recorrer su tempArray , este no es el propósito de .map() . El método .map() devuelve una nueva matriz, y la función de devolución de llamada que le pasa debería devolver un nuevo valor al que desea asignar el valor actual. Esto significa que puede usar .map() para crear tempArray , haciendo que la función de devolución de llamada devuelva un nuevo objeto que excluya la propiedad id :

 const manipulateData = (data) => { const tempArray = data.map(({id, ...rest}) => rest); // ... do what you need with `tempArray` ... };

Arriba, {id, ...rest} está desestructurando la sintaxis de asignación , que extrae la propiedad id del elemento actual y almacena todas las demás propiedades/valores del objeto actual en rest . Esto le permite crear un nuevo objeto que excluye la propiedad id .

Como nota al margen, no debe llamar a métodos como console.log() y manipulateData() dentro de JSX si no devuelven nada significativo que se mostrará en la pantalla; en su lugar, puede colocarlos en un gancho useEffect() .