Como añadir y modificar propiedades de los objetos - Curso de JavaScript de cero a máster - Capítulo 35

Ahora que ya sabes llamar a propiedades y métodos de los objetos, ha llegado el momento de que aprendas a añadirles y modificarles sus propiedades.

Como modificar los valores de las propiedades de los objetos en JavaScript

Para modificar los valores de las propiedades de un objeto lo puedes hacer de la misma forma que reasignas valores en las variables. Solo tendrás que especificar correctamente los espacios de nombres.

Código JavaScript 

let usuario = {
	nombre_completo: ['Enrique', 'Barros', 'Fernández'],
	edad: 30,
	telefonos : {
		telefono1: '0467489304',
		telefono2: '0446395860'
		},
	pais_residencia: 'Australia',
	idiomas: ['Español', 'Catalán', 'Inglés', 'Portugués', 'Italiano'],
};

usuario.edad = 27;

console.log(usuario.edad);

terminal Resultado en la consola terminal

27

Como utilizar las propiedades de los objetos en condicionales

Estos cambios en las propiedades de los objetos, los puedes utilizar para multitud de cosas. Por ejemplo, puedes utilizarlos en un condicional de esta forma:

Código JavaScript 

let usuario = {
	nombre_completo: ['Enrique', 'Barros', 'Fernández'],
	edad: 30,
	telefonos : {
		telefono1: '0467489304',
		telefono2: '0446395860'
		},
	pais_residencia: 'Australia',
	idiomas: ['Español', 'Catalán', 'Inglés', 'Portugués', 'Italiano'],
};

usuario.edad = 27;

if (usuario.edad != 30) {
	console.log('Se ha modificado la edad de ' + usuario.nombre_completo[0] + '.');
	console.log('El nuevo valor de edad es ahora ' + usuario.edad + '.');
}

terminal Resultado en la consola terminal

"Se ha modificado la edad de Enrique."
"El nuevo valor de edad es ahora 27."

Puedes ver que se han abierto una infinidad de caminos con el tema de los objetos. No puedo mostrártelos todos, pero intentaré mostrarte muchos para que al terminar el curso sepas desarrollar los tuyos propios.

Añadir nuevas propiedades a los objetos

Añadir nuevas propiedades a los objetos no podía ser más fácil. Lo tienes que hacer como con las variables. Si la propiedad no está declarada, se va a declarar automáticamente dentro del objeto. Si ya existe, se reasigna el valor.

let usuario = {
	nombre_completo: ['Enrique', 'Barros', 'Fernández'],
	edad: 30,
	telefonos : {
		telefono1: '0467489304',
		telefono2: '0446395860'
		},
	pais_residencia: 'Australia',
	idiomas: ['Español', 'Catalán', 'Inglés', 'Portugués', 'Italiano'],
};

usuario.direccion = "937 Beer Trafficway";

console.log(usuario);

terminal Resultado en la consola terminal

{
	direccion: "937 Beer Trafficway",
	edad: 30,
	idiomas: ["Español", "Catalán", "Inglés", "Portugués", "Italiano"],
	nombre_completo: ["Enrique", "Barros", "Fernández"],
	pais_residencia: "Australia",
	telefonos: {
		telefono1: "0467489304",
		telefono2: "0446395860"
	}
}

Ejercicios de JavaScript

  1. Añade al objeto usuario un tercer telefono.

    2. Código JavaScript 

    let usuario = {
	nombre_completo: ['Enrique', 'Barros', 'Fernández'],
	edad: 30,
	telefonos : {
		telefono1: '0467489304',
		telefono2: '0446395860'
		},
	pais_residencia: 'Australia',
	idiomas: ['Español', 'Catalán', 'Inglés', 'Portugués', 'Italiano'],
};
  2. Modifica el nombre_completo de usuario por el tuyo. Los apellidos también.
  3. Del array idiomas, cambia el idioma italiano por el francés.

La solución la encontrarás aquí: Haz click aquí.

Capítulos

    Suscríbete a mi canal de YouTube para apoyarme

    Si te ha gustado este curso y crees que el trabajo merece la pena, te agradeceré eternamente que te suscribas a mi canal de YouTube para apoyarme y que pueda seguir haciendo cursos gratuitos.

    Además, si te encanta la programación, tienes un montón más de cursos gratuitos para ver.

    No solo eso, podrás participar enviándome comentarios con tus sugerencias para temas específicos o cursos completos o incluso las dudas que tengas y las intentaré ir resolviendo en los cursos que estén todavía abiertos.

    Comentarios

    Si te quedan dudas sobre el temario, sobre JavaScript, o cualquier otra cosa relacionada o simplemente quieres agradecer, aquí tienes tu sitio para dejar tu granito de arena. Gracias por tus comentarios y por darle vida a este sitio web.