Introducción a los objetos - Curso de JavaScript de cero a máster - Capítulo 32

Seguimos avanzando viendo otro tema totalmente nuevo, los objetos de JavaScript. Algo que hemos estado utilizando en verdad durante todo el curso pero en el cual no hemos indagado en su interior todavía.

Objetos de JavaScript

¿Qué es un objeto?

Un objeto es una colección de datos relacionados entre sí. Estos están generalmente formados por variables y funciones, propiedades y métodos cuando estos forman parte de un objeto.

Diferencia entre variables, funciones, propiedades y métodos

Es importante que sepas que cuando se habla de variables que son de un objeto, a estas se les llama propiedades como te acabo de explicar.
En el caso de las funciones, si son pertenecientes a un objeto se les llama métodos.

Como crear un objeto en JavaScript

Los ejemplos son tan o más importantes que la propia teoría, de modo, que vamos a ver un ejemplo de creación de un objeto.

Cómo declarar objetos en JavaScript

Para declarar objetos en JavaScript, lo podemos hacer tanto con var, como con let o const entre otras formas. Ya veremos la diferencia, ahora lo importante es que te centres en crear un objeto.

Código JavaScript 

let objeto = {};

console.log(typeof objeto);

terminal Resultado en la consola terminal

Con el código anterior se acaba de crear un objeto literal vacío (ahora explicaré lo de literal). El typeof nos indica que efectivamente se ha creado un objeto.

object

Hemos creado el objeto con las llaves {} almacenadas en la variable objeto.

¿Qué son los literales?

Los literales son las asignaciones que les hacemos a las variables, por ejemplo, let nombre = "Enrique Barros Fernández" se trata de un string literal. Lo mismo ocurre con los objetos si les damos un valor nosotros mismos, son literales, lo estamos escribiendo literalmente por así decirlo.

Como añadir propiedades a un objeto en JavaScript

Este nuevo objeto vacío no te sirve nada más que para alardear de haberlo creado. Para que sea útil, hay que añadirle propiedades y métodos. Empecemos por las propiedades.

Tipos de propiedades de los objetos

Podemos almacenar propiedades de todo tipo de datos dentro de un objeto, incluso otros objetos.

Código JavaScript 

let usuario = {
	nombreCompleto: ['Enrique', 'Barros', 'Fernández'],
	edad: 30,
	telefono: '0467489304',
	paisResidencia: 'Australia',
	idiomas: ['Español', 'Catalán', 'Inglés', 'Portugués', 'Italiano'],
};

console.log(usuario);

terminal Resultado en la consola terminal

{nombreCompleto: Array(3), edad: 30, telefono: '0467489304',
paisResidencia: 'Australia', idiomas: Array(5)}

Además de esta primera información que nos da la consola, se pueden desplegar los array para ver los elementos y las posiciones que los conforman:

Propiedades de objeto JavaScript

Sintaxis de los objetos

Aquí puedes ver la sintaxis de un objeto solo con propiedades (pronto veremos como añadir métodos). Primero, se deben encerrar las propiedades y los métodos entre las llaves {}.
Se especifican las propiedades con un nombre variable válido seguido de dos puntos :. A continuación, se especifica el valor.
Cada propiedad se separa con una coma ,.

Código JavaScript 

// Pseudocódigo.
let objeto = {
	propiedad1: 'valor',
	propiedad2: 'valor',
	propiedad3: 'valor',
};

Es infinito lo que podemos hacer con los objetos, aún quizás no le veas la utilidad real, pero pronto lo harás. En el siguiente capítulo seguimos con más cosas sobre los objetos, espero que te hayas quedado con ganas de más.

Ejercicios de JavaScript

  1. Crea un objeto llamado vehiculo que contenga las siguientes propiedades:
    • marca
    • color
    • numeroRuedas
    • numeroPlazas
    • tipo
    • precio

    Los valores asignados a estas propiedades son libres.
    Con la propiedad tipo, me refiero a si es deportivo, todoterreno, etc.

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.