Neste tutorial, você aprenderá sobre a função do construtor JavaScript com a ajuda de exemplos.
Em JavaScript, uma função construtora é usada para criar objetos. Por exemplo,
// constructor function function Person () ( this.name = 'John', this.age = 23 ) // create an object const person = new Person();
No exemplo acima, function Person()é uma função de construtor de objeto.
Para criar um objeto a partir de uma função construtora, usamos a newpalavra - chave.
Nota : É considerada uma boa prática colocar a primeira letra da função de construtor em maiúscula.
Criar vários objetos com função de construtor
Em JavaScript, você pode criar vários objetos de uma função de construtor. Por exemplo,
// 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
No programa acima, dois objetos são criados usando a mesma função de construtor.
JavaScript esta palavra-chave
Em JavaScript, quando a thispalavra-chave é usada em uma função construtora, thisrefere-se ao objeto quando o objeto é criado. Por exemplo,
// constructor function function Person () ( this.name = 'John', ) // create object const person1 = new Person(); // access properties console.log(person1.name); // John
Portanto, quando um objeto acessa as propriedades, ele pode acessar diretamente a propriedade como person1.name.
Parâmetros de função do construtor JavaScript
Você também pode criar uma função de construtor com parâmetros. Por exemplo,
// 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"
No exemplo acima, passamos argumentos para a função construtora durante a criação do objeto.
const person1 = new Person('John', 23, 'male'); const person2 = new Person('Sam', 25, 'male');
Isso permite que cada objeto tenha propriedades diferentes. Como mostrado acima,
console.log(person1.name); dá John
console.log(person2.name); dá Sam
Criar Objetos: Função de Construtor Vs Literal de Objeto
- Object Literal é geralmente usado para criar um único objeto. A função construtora é útil se você deseja criar vários objetos. Por exemplo,
// 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 criado a partir da função do construtor é único. Você pode ter as mesmas propriedades da função do construtor ou adicionar uma nova propriedade a um objeto específico. Por exemplo,
// using constructor function function Person () ( this.name = 'Sam' ) let person1 = new Person(); let person2 = new Person(); // adding new property to person1 person1.age = 20;
Agora, esta agepropriedade é exclusiva para o person1objeto e não está disponível para o person2objeto.
No entanto, se um objeto for criado com um literal de objeto e se uma variável for definida com esse valor de objeto, qualquer alteração no valor da variável alterará o objeto original. Por exemplo,
// 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
Quando um objeto é criado com um literal de objeto, qualquer variável de objeto derivada desse objeto atuará como um clone do objeto original. Portanto, qualquer alteração feita em um objeto também se refletirá no outro objeto.
Adicionando propriedades e métodos em um objeto
Você pode adicionar propriedades ou métodos em um 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();
Resultado
hello Uncaught TypeError: person2.greet não é uma função
No exemplo acima, uma nova propriedade gendere um novo método greet()são adicionados ao person1objeto.
No entanto, essa nova propriedade e método são apenas adicionados a person1. Você não pode acessar genderou greet()de person2. Portanto, o programa dá erro quando tentamos acessarperson2.greet();
Protótipo de objeto JavaScript
Você também pode adicionar propriedades e métodos a uma função de construtor usando um protótipo . Por exemplo,
// 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 saber mais sobre protótipos, visite Protótipo de JavaScript.
Construtores internos de JavaScript
JavaScript também tem construtores integrados. Alguns deles são:
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
Em JavaScript, as strings podem ser criadas como objetos:
const name = new String ('John'); console.log(name); // "John"
Em JavaScript, os números podem ser criados como objetos por:
const number = new Number (57); console.log(number); // 57
Em JavaScript, os booleanos podem ser criados como objetos por:
const count = new Boolean(true); console.log(count); // true
Nota : Recomenda-se usar tipos de dados primitivos e criá-los de maneira normal, como const name = 'John';, const number = 57;econst count = true;
Você não deve declarar strings, números e valores booleanos como objetos porque eles tornam o programa mais lento.
Nota : Em JavaScript, a palavra-chave classfoi introduzida no ES6 (ES2015) que também nos permite criar objetos. As classes são semelhantes às funções do construtor em JavaScript. Para saber mais, visite Classes de JavaScript.
