Objetos en JavaScript

Este es el cuarto tutorial de la serie 'Mis apuntes JavaScript'. En este tutorial aprenderemos que son los objetos y como utilizarlos en JavaScript.

Índice

1. Los objetos
2. Alcance de los cambios
3. Comparación de objetos

1. Los objetos

En JavaScript es muy común usar objetos. Un objeto es una especie de variable que tiene propiedades asociadas a él. Estas propiedades definen características del objeto y son básicamente variables. Po lo que una propiedad puede ser una variable, un objeto o incluso un método.

let people = {
  name: "Andy",
  family: {
    father: "Papá",
    mother: "Mamá",
  },
  saludar: function () {
    console.log("Hola");
  },
};
console.log(people); // { name: 'Andy' family: {...}}
people.saludar(); // Hola

Las funciones también pueden recibir objetos como parametros.

function printName(obj) {
  console.log(`Mi nombre es ${obj.name} y mi edad es ${obj.age}`);
}

let yo = {
  name: "Andy",
  age: 22,
};

printName(yo); // Mi nombre es Andy y tengo 22 años

Pero si a nuestra función solo le interesa una propiedad del objeto podemos hacer una función que solo acepte dicha propiedad.

function printName({ name }) {
  console.log(`Mi nombre es ${name}`);
}

let yo = {
  name: "Andy",
  age: 23,
};

printName(yo); // Mi nombre es Andy

También podemos crear una variable usando la propiedad de una función. La variable tomará el nombre de la propiedad del objeto.

let yo = {
  name: "Andy",
  age: 23,
};

let { name } = yo;
console.log(name); // Andy

2. Alcance de los cambios

Si pasamos a una función todo el objeto y lo modificamos dentro de la función, todo el objeto queda modificado.

let yo = {
  name: "Andy",
  age: 22,
};

function changeName(obj, new_name) {
  obj.name = new_name;
}
changeName(yo, "AndyGeek");
console.log(yo); // { name: 'AndyGeek', age: 22 }

Pero si solo le mandamos la propiedad del objeto este no cambiará.

let yo = {
  name: "Andy",
  age: 23,
};

function changeName({ name }, new_name) {
  name = new_name;
}
changeName(yo.name, "AndyGeek");
console.log(yo); // { name: 'Andy', age: 23 }

Una forma de escribir una función que cambie parametros de un objeto para luego devolverlos modificados es:

let yo = {
  name: "Andy",
  age: 23,
};

function changeName(obj, name) {
  return {
    ...obj,
    name: name,
  };
}
let tu = changeName(yo, "AndyGeek");
console.log(tu); // { name: 'AndyGeek', age: 23 }

3. Comparación de objetos

Comparar objetos en JavaScript es comparar las referencias de memoria de los objetos. Por lo que no hay forma que dos objetos creados en distintas partes del código sean iguales a menos que uno de ellos referencie al otro.

var Andy = {
  name: "Andy",
};

var otraPersona = {
  name: "Andy",
};

console.log(Andy == otraPersona); //false
console.log(Andy === otraPersona); //false

Si queremos obtener objetos iguales solo bastaría con apuntar un nuevo objeto al mismo lugar de memoria de la siguiente manera.

Andy = otraPersona;
console.log(Andy === otraPersona); //true
console.log(Andy == otraPersona); //true

Luego si cambiamos el valor de otraPersona también cambiará el valor de Andy ya que las dos variables apuntan al mismo lugar de memoria.