Métodos de objetos en JavaScript - Codificación N Concepts

Este artículo describe el uso de varios métodos de objeto como Object.create(), Object.assign(), Object.freeze(), Object.seal() y muchos más disponibles en JavaScript con ejemplos.

Índice
  1. Objeto.crear()
  2. Objeto.assign()
  3. Objeto.congelar()
  4. Objeto.sello()
  5. Objeto.defineProperty()
  6. Objeto.defineProperties()
  7. Objeto.claves(), Objeto.valores() & Objeto.entradas()
  8. Objeto.es()
  9. Resumen

Objeto.crear()

los Object.create() El método se utiliza para crear un nuevo objeto con su prototipo establecido en el objeto existente.

var car = {
    color: "black",
    brand: "Toyota",
    drive: function(){
      console.log(`Driving a ${this.isTopModel ? 'top model' : ''} ${this.color} color ${this.brand} car`);
    }
}
var newCar = Object.create(car);
newCar.brand = "Honda";
newCar.isTopModel = true;

console.log(car.isPrototypeOf(newCar)); //true
newCar.drive();

Output

true Driving a top model black color Honda car

Aquí mismo newCar crea un objeto completamente nuevo con su prototipo configurado para Car. Arreglamos el brand y isTopModel valores mientras que el valor de color será heredado. cuando llamamos drive() método, encuentra el drive() en la cadena de prototipos en car y correr.

Objeto.assign()

Object.assign() se utiliza para copiar propiedades y funciones de un objeto a otro objeto.

Podemos fusionar dos objetos usando Object.assign() de la siguiente manera:-

// Initialize an object
const favorites = {
    color: 'Red',
    number: 5   
};

// Initialize another object
const somemore = {
    fruit: 'Mango',
    movies: ["Spider Man", "Conjuring"],   
};

// Merge the objects
console.log(Object.assign(favorites, somemore));

Output

{color: "Red", number: 5, fruit: "Mango", movies: ["Spider Man", "Conjuring"]}

También se puede utilizar en el aula. constructor asignar todos los valores a this de la siguiente manera:

class Car {
    constructor(brand, color, price){
        Object.assign(this, {brand, color, price});
    }
}

Objeto.congelar()

Object.freeze() congela el estado de un objeto una vez que se llama a este método. Ignora si se cambia una propiedad existente y si se agrega una nueva propiedad.

// Initialize an object
const user = {
    username: 'admin',
    password: 'password@123'
};
// Freeze the object
Object.freeze(user);

user.password = '*******';
user.active = true;

console.log(user);

Output

{username: "admin", password: "password@123"}

Objeto.sello()

Object.seal() sella el estado de un objeto una vez que se llama a este método. Permite la modificación de propiedades existentes, pero ignora si se agrega una nueva propiedad.

// Initialize an object
const user = {
    name: 'admin',
    password: 'password@123'
};
// Seal the object
Object.seal(user);

user.password = '*******';
user.active = true;

console.log(user);

Output

{name: "admin", password: "*******"}

Objeto.defineProperty()

Object.defineProperty() se utiliza para establecer una nueva propiedad en un objeto existente.

La propiedad se puede configurar con las siguientes opciones:

  • value: el valor predeterminado es indefinido, si no se proporciona el valor de la propiedad
  • writable: el valor predeterminado es falso, si es verdadero significa que el valor de la propiedad se puede cambiar
  • configurable: el valor predeterminado es falso, si es verdadero significa que la propiedad se puede eliminar
  • enumerable: el valor predeterminado es falso, si es verdadero significa que la propiedad se puede enumerar como en un bucle for..in
var user = {};

Object.defineProperty(user, "name", {
  value: "admin"
});

console.log(user);

es equivalente a

var user = {};

Object.defineProperty(user, "name", {
  value: "admin",
  writable: false,
  configurable: false,
  enumerable: false
});

console.log(user);

Output

{name: "admin"}

Objeto.defineProperties()

Object.defineProperties() se puede utilizar para establecer múltiples propiedades en un objeto existente.

var user = {};

Object.defineProperties(user, {
  name: {
    value: "admin",
    writable: true,
    enumerable: true
  },
  password: {
    value: 'password@123',
    writable: false,
    enumerable: false
  }      
});

console.log(user);

Output

{name: "admin", password: "password@123"}

Objeto.claves(), Objeto.valores() & Objeto.entradas()

Object.keys(), Object.values() y Object.entries() se puede usar como un iterador del objeto de la siguiente manera:

let favorites = {
    color: 'Red',
    number: 5,
    vegan: true,
    movies: ["Spider Man", "Conjuring"]   
};

console.log("keys", Object.keys(favorites));
console.log("values", Object.values(favorites));
console.log("entries", Object.entries(favorites));

Output

keys ["color", "number", "vegan", "movies"] values ["Red", 5, true, ["Spider Man", "Conjuring"]] entries [ ["color", "Red"], ["number", 5], ["vegan", true], ["movies", ["Spider Man", "Conjuring"] ]

Object.keys() y Object.entries() se puede usar para iterar sobre claves y valores de un objeto de la siguiente manera:

Object.keys(favorites).forEach(key => console.log(`${key}: ${favorites[key]}`));

Object.entries(favorites).forEach(entry => console.log(`${entry[0]}: ${entry[1]}`));

Objeto.es()

ES6 introdujo un nuevo método Object.is() para comparar dos valores, funciona de manera muy similar al operador de comparación estricta === y también evitar la confusión de las comparaciones NaN y las comparaciones +0/-0. Se recomienda utilizar Object.is() para comparaciones de valor.

veamos esto,

console.log(Object.is("cnc", "cnc"));     // true, same content and type
console.log(Object.is(12345, 12345));     // true, same content and type
console.log(Object.is(false, false));     // true, same content and type

console.log(Object.is(12345, "12345"));   // false, different type
console.log(Object.is(0, false));         // false, different type
console.log(Object.is("", false));        // false, different type
console.log(Object.is(null, undefined));  // false, different type

console.log(Object.is([], []));           // false, both refers to different object in memory
console.log(Object.is([1, 2], [1, 2]));   // false, both refers to different object in memory
console.log(Object.is({}, {}));           // false, both refers to different object in memory

var array1 = [1, 2, 3, 4, 5];
var array2 = array1;
console.log(Object.is(array1, array2));   // true, both refers to same array

var obj1 = { app : "cnc"};
var obj2 = obj1;
console.log(Object.is(obj1, obj2));       // true, both refers to same object

console.log(NaN === NaN);                 // false, confusing, content and type is same
console.log(Object.is(NaN, NaN));         // true, es6 is good, same content and type

console.log(+0 === -0);                   // true, confusing, content is different
console.log(Object.is(+0, -0));           // false, es6 is good, different content

Resumen

Javascript Object proporciona métodos muy útiles para

  • crear un nuevo objeto usando Object.create()
  • copiar un objeto usando Object.assign()
  • proteger el objeto con Object.freeze() y Object.seal()
  • establecer las propiedades de un objeto usando Object.defineProperty() y Object.defineProperties()
  • iterar a través del objeto usando Object.keys(), Object.values() y Object.entries()
  • comparar objetos usando Object.is()

Si quieres conocer otros artículos parecidos a Métodos de objetos en JavaScript - Codificación N Concepts puedes visitar la categoría Tutoriales.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Subir

Esta página web utiliza cookies para analizar de forma anónima y estadística el uso que haces de la web, mejorar los contenidos y tu experiencia de navegación. Para más información accede a la Política de Cookies . Ver mas