Eliminar la propiedad del objeto en JavaScript

1. Usar el operador delete para eliminar una propiedad de un objeto en JavaScript
2. Usa la librería underscore para eliminar una propiedad de un objeto en JavaScript
3. Use la sintaxis spread para eliminar una propiedad de un objeto en JavaScript ECMAScript 6

Este tutorial explicará cómo podemos eliminar una propiedad de un objeto en JavaScript con múltiples métodos. Lo demostraremos usando el operador delete, el mecanismo de reasignación, la librería underscore, y la sintaxis spread en ECMAScript 6.

Usar el operador delete para eliminar una propiedad de un objeto en JavaScript

Un método para eliminar cualquiera de las propiedades de cualquier objeto es el operador delete. Este operador elimina la propiedad del objeto. Por ejemplo, tenemos un objeto myObject con las propiedades id, subject y grade, y necesitamos eliminar la propiedad grade.

var myObject = {'id': '12345', 'subject': 'programming', 'grade': 'A'};

console.log('Original object:', myObject);
// delete the grade property
delete myObject.grade
console.log('Updated object: ', myObject)

Resultado:

Original object: {id: "12345", subject: "programming", grade: "A"}
Updated object:  {id: "12345", subject: "programming"}

Usa la librería underscore para eliminar una propiedad de un objeto en JavaScript

Una de las bibliotecas que puede ayudar a eliminar una propiedad de un objeto en JavaScript pero sin actualizar el objeto original es la biblioteca de underscore. Esa biblioteca proporciona dos funciones importantes _.pick() y _.omit().

La función _.omit() podría eliminar la propiedad dada del objeto y devolver una copia actualizada.

var myObject = {'id': '12345', 'subject': 'programming', 'grade': 'A'};

console.log('Original object:', myObject);

var updatedObject = _.omit(myObject, 'grade')
console.log('Updated object with omit() : ', updatedObject)
console.log('Original object after update:', myObject);

Resultado:

Original object: {id: "12345", subject: "programming", grade: "A"}
Updated object with omit() :  {id: "12345", subject: "programming"}
Original object after update: {id: "12345", subject: "programming", grade: "A"}

La función _.pick() incluye sólo las propiedades dadas del objeto y descuida todas las demás propiedades, y devuelve una copia actualizada de ese objeto.

var myObject = {'id': '12345', 'subject': 'programming', 'grade': 'A'};

console.log('Original object:', myObject);

var updatedObject = _.pick(myObject, 'id', 'subject')
console.log('Updated object with pick() : ', updatedObject)
console.log('Original object after update:', myObject);

Resultado:

Original object: {id: "12345", subject: "programming", grade: "A"}
Updated object with pick() :  {id: "12345", subject: "programming"}
Original object after update: {id: "12345", subject: "programming", grade: "A"}

Podemos importar la biblioteca desde aquí.

Use la sintaxis spread para eliminar una propiedad de un objeto en JavaScript ECMAScript 6

La sintaxis de JavaScript spread en ECMAScript 6 proporciona una forma muy elegante de eliminar las propiedades dadas del objeto de JavaScript sin cambiar el objeto original pero devolviendo el objeto recién actualizado.

Cuando usamos la sintaxis spread, parecerá como si separáramos el objeto original en dos variables. Una de ellas será la propiedad eliminada. La otra variable contendrá una copia del objeto original sin ese objeto eliminado.

var myObject = {'id': '12345', 'subject': 'programming', 'grade': 'A'};

console.log('Original object:', myObject);

var {grade, ...myUpdatedObject} = myObject;

console.log('The removed \'grade\' property : ', grade)
console.log('Updated object : ', myUpdatedObject)
console.log('Original object after update:', myObject);

Resultado:

Original object: {id: "12345", subject: "programming", grade: "A"}
The removed 'grade' property :  A
Updated object :  {id: "12345", subject: "programming"}
Original object after update: {id: "12345", subject: "programming", grade: "A"}