Dada una array de objetos y la tarea es eliminar el elemento de objeto duplicado de la lista de array. Hay dos métodos para resolver este problema que se discuten a continuación:
Método 1: Usar una de las claves como índice: Se crea una array temporal que almacena los objetos de la array original utilizando una de sus claves como índice. Cualquiera de las propiedades del objeto se puede utilizar como clave. La clave se extrae del objeto y se utiliza como índice de la nueva array temporal. A continuación, el objeto se asigna a este índice. Este enfoque eliminará los objetos duplicados ya que solo uno de cada objeto de la array original se asignará al mismo índice.
Ejemplo:
<!DOCTYPE html>
<html>
<head>
<title>
How to remove duplicates from an
array of objects using JavaScript ?
</title>
</head>
<body>
<h1 style="color: green">
GeeksforGeeks
</h1>
<b>
How to remove duplicates from
an array of objects?
</b>
<p>
Click on the button to remove
the duplicated in the array
</p>
<p>Check the console for the output</p>
<button onclick="removeDuplicates()">
Click here
</button>
<script type="text/javascript">
function removeDuplicates() {
// Create an array of objects
books = [
{ title: "C++", author: "Bjarne" },
{ title: "Java", author: "James" },
{ title: "Python", author: "Guido" },
{ title: "Java", author: "James" },
];
// Display the list of array objects
console.log(books);
// Declare a new array
let newArray = [];
// Declare an empty object
let uniqueObject = {};
// Loop for the array elements
for (let i in books) {
// Extract the title
objTitle = books[i]['title'];
// Use the title as the index
uniqueObject[objTitle] = books[i];
}
// Loop to push unique object into array
for (i in uniqueObject) {
newArray.push(uniqueObject[i]);
}
// Display the unique objects
console.log(newArray);
}
</script>
</body>
</html>
Producción:
- Antes de hacer clic en el botón:
- Después de hacer clic en el botón:
Método 2: convertir la array en un conjunto para eliminar los duplicados: un objeto Conjunto solo contiene valores únicos de cualquier tipo. Esta propiedad se puede usar para almacenar solo los objetos que son únicos en la array.
Cada objeto de la array se convierte primero en una string codificada en JSON mediante el método JSON.stringify. Luego, la string codificada en JSON se asigna a una array mediante el método map(). Se crea un nuevo conjunto pasando esta array al constructor del nuevo conjunto. Este paso eliminará todos los elementos duplicados ya que las strings codificadas en JSON serán las mismas para los mismos elementos.
Luego, el conjunto se convierte en una array utilizando el método from(), pasando el conjunto como un parámetro. Esta array no tendrá objetos duplicados.
Ejemplo:
<!DOCTYPE html>
<html>
<head>
<title>
How to remove duplicates
from an array of objects?
</title>
</head>
<body>
<h1 style="color: green">
GeeksforGeeks
</h1>
<b>
How to remove duplicates
from an array of objects?
</b>
<p>
Click on the button to remove
the duplicated in the array
</p>
<p>Check the console for the output</p>
<button onclick="removeDuplicates()">
Click here
</button>
<script type="text/javascript">
function removeDuplicates() {
// Create an array of objects
books = [
{ title: "C++", author: "Bjarne" },
{ title: "Java", author: "James" },
{ title: "Python", author: "Guido" },
{ title: "Java", author: "James" },
];
jsonObject = books.map(JSON.stringify);
console.log(jsonObject);
uniqueSet = new Set(jsonObject);
uniqueArray = Array.from(uniqueSet).map(JSON.parse);
console.log(uniqueArray);
}
</script>
</body>
</html>
Producción:
- Producción:
- Después de hacer clic en el botón:
Publicación traducida automáticamente
Artículo escrito por sayantanm19 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA