Crear un objeto JavaScript con una función

| Última modificación: 18 de marzo de 2024 | Tiempo de Lectura: 3 minutos

Algunos de nuestros reconocimientos:

Premios KeepCoding

¿Sabes cómo crear un objeto JavaScript mediante una función? En el mundo de la programación, las funciones en JavaScript no solo nos permiten ejecutar un conjunto de instrucciones, sino que también tienen un increíble poder: ¡crear objetos! Con las funciones podemos dar vida a nuevos objetos y dotarlos de todas las propiedades y métodos que deseemos. En este artículo, exploraremos cómo crear un objeto JavaScript utilizando una función con la palabra clave “new” y cómo personalizar sus propiedades y métodos.

Crear un objeto Javascript

¿Qué es un objeto JavaScript?

En JavaScript, un objeto es una estructura de datos que permite almacenar y organizar valores relacionados. Se puede considerar una colección de propiedades, donde cada propiedad tiene un nombre (clave) y un valor asociado. Los valores pueden ser cualquier tipo de dato, incluyendo otros objetos, funciones, arreglos, números o cadenas, entre otros.

Los objetos en JavaScript son fundamentales para su paradigma de programación orientada a objetos (POO). Proporcionan una forma flexible de representar y manipular datos, lo que facilita la creación de aplicaciones y el desarrollo de lógica compleja.

Los objetos en JavaScript heredan propiedades y métodos de su prototipo, lo que permite la reutilización de código y la implementación de herencia en el lenguaje.

Object.create y el objeto literal

Antes de adentrarnos en el proceso de crear un objeto JavaScript mediante funciones, es esencial mencionar otra forma de hacerlo: Object.create y el objeto literal. A través de Object.create, podemos crear un nuevo objeto que hereda todas las propiedades de otro objeto. Por otro lado, el objeto literal nos permite crear un objeto directamente y definir sus propiedades y métodos en el mismo instante de su creación.

//Crear un objeto JavaScript con una función
// Object.create
const objetoHeredado = {
  prop1: "Hola",
  prop2: "Mundo",
};

const nuevoObjeto = Object.create(objetoHeredado);

// Objeto literal
const miObjetoLiteral = {
  nombre: "KeepCoding",
  sector: "Tecnología",
  fundacion: 2015,
};

Crear un objeto JavaScript mediante una función

Ahora, entremos en la magia de las funciones constructoras de objetos en JavaScript. Para ello, utilizaremos la palabra clave “new”. Veamos un ejemplo:

//Crear un objeto JavaScript mediante una función
function Fruta(nombre) {
  this.nombre = nombre;
  this.saluda = function() {
    console.log(`Hola, soy ${this.nombre}!`);
  };
}

const limon = new Fruta("Limón");

En este caso, hemos definido la función Fruta, que toma un parámetro llamado nombre. Al utilizar new Fruta(“Limón”), se crea un nuevo objeto llamado limon, con una propiedad nombre establecida como “Limón” y un método saluda que imprimirá un mensaje por consola. Es importante recordar que this dentro de la función constructora se refiere al objeto que se creará.

Eliminar una propiedad de un objeto

En ocasiones, es necesario eliminar una propiedad de un objeto. Para hacerlo, podemos utilizar la palabra clave delete seguida del nombre de la propiedad que deseamos eliminar. Veamos un ejemplo:

//Crear un objeto JavaScript mediante una función
const coche = {
  marca: "Toyota",
  modelo: "Corolla",
  año: 2023,
};

delete coche.año; // Eliminamos la propiedad "año"

Nombres de propiedades y notación literal

Al trabajar con objetos en JavaScript, podemos acceder a sus propiedades de dos formas: mediante la notación de puntos o mediante la notación de corchetes. Ambas son igualmente válidas y nos permiten manipular las propiedades del objeto. Veamos cómo se realiza esto:

//Crear un objeto JavaScript mediante una función
const persona = {
  nombre: "Juan",
  edad: 30,
};

console.log(persona.nombre); // Usando notación de puntos
console.log(persona["edad"]); // Usando notación de corchetes

Personalizar objetos y métodos

Ahora que hemos aprendido cómo crear un objeto JavaScript mediante funciones constructoras, podemos personalizarlo y agregarle tantas propiedades y métodos como deseemos. Imagina que quieres agregar el método vuela a nuestro objeto Fruta, que hemos definido previamente; podríamos hacerlo de la siguiente manera:

//Crear un objeto JavaScript mediante funciones
function Fruta(nombre) {
  this.nombre = nombre;
  this.saluda = function() {
    console.log(`Hola, soy ${this.nombre}!`);
  };
  this.vuela = function() {
    console.log(`Soy un ${this.nombre} y estoy volando!`);
  };
}

const limon = new Fruta("Limón");
limon.vuela(); // Imprimirá "Soy un Limón y estoy volando!"

¡Aprende más con KeepCoding!

En el apasionante mundo de la programación, el conocimiento es la clave para abrir las puertas hacia un futuro lleno de oportunidades. Si deseas sumergirte es este sector y convertirte en un experto, no dudes en unirte a nuestro Desarrollo web Full Stack Bootcamp. A través de un enfoque práctico y orientado a proyectos reales, te proporcionaremos todas las herramientas necesarias para triunfar en el sector tecnológico. Aprovecha esta oportunidad para cambiar tu vida y adentrarte en una industria con alta demanda de profesionales, salarios altos y una estabilidad laboral envidiable. ¡Te esperamos para transformar tu futuro en el mundo de la tecnología!

Alberto Casero

Alberto Casero es CTO en Watium, Fundador de Kas Factory & Coordinador del Bootcamp en Desarrollo Web.

Posts más leídos

¡CONVOCATORIA ABIERTA!

Desarrollo Web

Full Stack Bootcamp

Clases en Directo | Profesores en Activo | Temario 100% actualizado