¿Cómo usar el operador new en JavaScript?

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

Algunos de nuestros reconocimientos:

Premios KeepCoding

JavaScript es un lenguaje de programación muy utilizado en el desarrollo web y, como tal, es fundamental comprender cómo funciona el operador new en JavaScript. Este operador desempeña un papel esencial en la creación de objetos y en la construcción de aplicaciones web sólidas y eficientes. En este artículo, exploraremos en detalle el uso del operador new, las funciones constructoras y cómo crear objetos en JavaScript.

Funciones donstructoras

En JavaScript, las funciones constructoras son funciones especiales que se utilizan para crear objetos similares. Normalmente, los constructores se definen con una letra mayúscula al principio, lo que facilita su identificación. Veamos un ejemplo básico de una función constructora:

function Persona(nombre, edad) { 
this.nombre = nombre; 
this.edad = edad; 
}

En este caso, hemos definido una función constructora llamada Persona que toma dos parámetros, nombre y edad, y crea un nuevo objeto con estas propiedades.

Creando un nuevo objeto con el operador new en JavaScript

Una vez que hemos definido una función constructora, podemos utilizar el operador new en JavaScript para crear un nuevo objeto basado en esa función. Aquí está cómo se hace:

const persona1 = new Persona('Juan', 30); 
const persona2 = new Persona('María', 25);

Al utilizar new antes de la función constructora Persona, estamos creando dos nuevos objetos, persona1 y persona2, con las propiedades nombre y edad definidas en la función constructora. Estos objetos son ahora instancias de la función Persona.

Propiedad value del operador new

Cuando se utiliza el operador new, se crea un nuevo objeto vacío. Luego, la función constructora se llama con los argumentos especificados, y el valor de this dentro de la función constructora se establece en el nuevo objeto. Finalmente, el nuevo objeto se devuelve como resultado de la llamada a la función constructora.

function MiFuncion() { 
this.valor = 42; 
return { valor: 10 }; 
} 
const objeto = new MiFuncion(); 
console.log(objeto.valor); // Salida: 10

Como se puede ver en el ejemplo anterior, aunque la función constructora MiFuncion establece this.valor en 42, el objeto resultante tiene un valor de 10. Esto se debe a que el return en la función constructora reemplaza el objeto recién creado.

Tipos de datos y el operador new en JavaScript

El operador new en JavaScript no se limita a crear objetos vacíos. También se puede usar con otros tipos de datos, como funciones y arreglos.

const arreglo = new Array(1, 2, 3); 
console.log(arreglo); // Salida: [1, 2, 3] 
const funcion = new Function('a', 'b', 'return a + b;'); 
console.log(funcion(2, 3)); // Salida: 5

En estos ejemplos, estamos utilizando el operador new para crear un nuevo arreglo y una nueva función. Esto muestra la versatilidad del operador new en JavaScript.

Creación de objetos personalizados

Además de utilizar el operador new en JavaScript con tipos de datos predefinidos, también podemos usarlo para crear objetos personalizados. Esto es útil cuando deseamos encapsular datos y comportamientos relacionados en un solo objeto.

function Coche(marca, modelo) { 
this.marca = marca; 
this.modelo = modelo; 
this.arrancar = function() { 
console.log(`El ${this.marca} ${this.modelo} ha arrancado.`); 
}; 
} 
const miCoche = new Coche('Toyota', 'Camry'); 
miCoche.arrancar(); // Salida: El Toyota Camry ha arrancado.

En este ejemplo, hemos creado una función constructora Coche que tiene propiedades marca y modelo, así como un método arrancar. Luego, utilizamos el operador new para crear un nuevo objeto miCoche basado en esta función constructora.

En resumen, el operador new en JavaScript es una herramienta poderosa para crear objetos y otros tipos de datos personalizados. Permite la encapsulación de datos y comportamientos relacionados en objetos, lo que facilita el desarrollo de aplicaciones web más estructuradas y eficientes.

Te enseñamos más

Si estás interesado en aprender más sobre el uso del operador new en JavaScript y otras habilidades esenciales de desarrollo web, considera unirte al Desarrollo Web Full Stack Bootcamp de KeepCoding. En esta formación intensiva, adquirirás conocimientos y habilidades que te prepararán para una emocionante carrera en el sector de la tecnología. Con la alta demanda de profesionales en este campo y los salarios competitivos que ofrece, el desarrollo web será tu pasaporte para un cambio de vida significativo. ¡No pierdas esta oportunidad y comienza tu viaje hacia una carrera en desarrollo web ahora mismo!

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