En este tutorial, aprenderá sobre la función constructora de JavaScript con la ayuda de ejemplos.
En JavaScript, se utiliza una función de constructor para crear objetos. Por ejemplo,
// constructor function function Person () ( this.name = 'John', this.age = 23 ) // create an object const person = new Person();
En el ejemplo anterior, function Person()es una función de constructor de objetos.
Para crear un objeto a partir de una función constructora, usamos la newpalabra clave.
Nota : Se considera una buena práctica poner en mayúscula la primera letra de su función constructora.
Crear varios objetos con la función de constructor
En JavaScript, puede crear varios objetos a partir de una función de constructor. Por ejemplo,
// constructor function function Person () ( this.name = 'John', this.age = 23, this.greet = function () ( console.log('hello'); ) ) // create objects const person1 = new Person(); const person2 = new Person(); // access properties console.log(person1.name); // John console.log(person2.name); // John
En el programa anterior, se crean dos objetos usando la misma función constructora.
JavaScript esta palabra clave
En JavaScript, cuando thisse utiliza una palabra clave en una función de constructor, se thisrefiere al objeto cuando se crea el objeto. Por ejemplo,
// constructor function function Person () ( this.name = 'John', ) // create object const person1 = new Person(); // access properties console.log(person1.name); // John
Por lo tanto, cuando un objeto accede a las propiedades, puede acceder directamente a la propiedad como person1.name.
Parámetros de función de constructor de JavaScript
También puede crear una función constructora con parámetros. Por ejemplo,
// constructor function function Person (person_name, person_age, person_gender) ( // assigning parameter values to the calling object this.name = person_name, this.age = person_age, this.gender = person_gender, this.greet = function () ( return ('Hi' + ' ' + this.name); ) ) // creating objects const person1 = new Person('John', 23, 'male'); const person2 = new Person('Sam', 25, 'female'); // accessing properties console.log(person1.name); // "John" console.log(person2.name); // "Sam"
En el ejemplo anterior, hemos pasado argumentos a la función constructora durante la creación del objeto.
const person1 = new Person('John', 23, 'male'); const person2 = new Person('Sam', 25, 'male');
Esto permite que cada objeto tenga diferentes propiedades. Como se muestra arriba,
console.log(person1.name); le da a John
console.log(person2.name); le da a Sam
Crear objetos: función de constructor versus literal de objeto
- Object Literal se usa generalmente para crear un solo objeto. La función constructora es útil si desea crear varios objetos. Por ejemplo,
// using object literal let person = ( name: 'Sam' )
// using constructor function function Person () ( this.name = 'Sam' ) let person1 = new Person(); let person2 = new Person();
- Cada objeto creado a partir de la función constructora es único. Puede tener las mismas propiedades que la función constructora o agregar una nueva propiedad a un objeto en particular. Por ejemplo,
// using constructor function function Person () ( this.name = 'Sam' ) let person1 = new Person(); let person2 = new Person(); // adding new property to person1 person1.age = 20;
Ahora esta agepropiedad es única para el person1objeto y no está disponible para person2objetar.
Sin embargo, si un objeto se crea con un objeto literal, y si una variable se define con ese valor de objeto, cualquier cambio en el valor de la variable cambiará el objeto original. Por ejemplo,
// using object lateral let person = ( name: 'Sam' ) console.log(person.name); // Sam let student = person; // changes the property of an object student.name = 'John'; // changes the origins object property console.log(person.name); // John
Cuando se crea un objeto con un objeto literal, cualquier variable de objeto derivada de ese objeto actuará como un clon del objeto original. Por lo tanto, cualquier cambio que realice en un objeto también se reflejará en el otro objeto.
Agregar propiedades y métodos en un objeto
Puede agregar propiedades o métodos en un objeto como este:
// constructor function function Person () ( this.name = 'John', this.age = 23 ) // creating objects let person1 = new Person(); let person2 = new Person(); // adding property to person1 object person1.gender = 'male'; // adding method to person1 object person1.greet = function () ( console.log('hello'); ) person1.greet(); // hello // Error code // person2 doesn't have greet() method person2.greet();
Salida
hola Uncaught TypeError: person2.greet no es una función
En el ejemplo anterior, se agrega una nueva propiedad gendery un nuevo método greet()al person1objeto.
Sin embargo, esta nueva propiedad y método solo se agrega a person1. No puede acceder gendero greet()desde person2. De ahí que el programa dé error cuando intentamos accederperson2.greet();
Prototipo de objeto JavaScript
También puede agregar propiedades y métodos a una función de constructor usando un prototipo . Por ejemplo,
// constructor function function Person () ( this.name = 'John', this.age = 23 ) // creating objects let person1 = new Person(); let person2 = new Person(); // adding new property to constructor function Person.prototype.gender = 'Male'; console.log(person1.gender); // Male console.log(person2.gender); // Male
Para obtener más información sobre los prototipos, visite JavaScript Prototype.
Constructores incorporados de JavaScript
JavaScript también tiene constructores integrados. Algunos de ellos son:
let a = new Object(); // A new Object object let b = new String(); // A new String object let c = new Number(); // A new Number object let d = new Boolean(); // A new Boolean object
En JavaScript, las cadenas se pueden crear como objetos mediante:
const name = new String ('John'); console.log(name); // "John"
En JavaScript, los números se pueden crear como objetos mediante:
const number = new Number (57); console.log(number); // 57
En JavaScript, los booleanos se pueden crear como objetos mediante:
const count = new Boolean(true); console.log(count); // true
Nota : Se recomienda utilizar tipos de datos primitivos y crearlos de forma normal, como const name = 'John';, const number = 57;yconst count = true;
No debe declarar cadenas, números y valores booleanos como objetos porque ralentizan el programa.
Nota : En JavaScript, la palabra clave classse introdujo en ES6 (ES2015) que también nos permite crear objetos. Las clases son similares a las funciones de constructor en JavaScript. Para obtener más información, visite Clases de JavaScript.
