Construtores de objetos. Criando objetos em Javascript O que é um construtor em js

function User (name, age) (this.name = name; this.age = age; this.sayHi = function () (console.log ("Hello!");)) let user = new User ("Homer", 33); console.log (user.name);

Cada objeto criado com um construtor tem uma propriedade constructor adicionada implicitamente contendo uma referência ao construtor com o qual o objeto foi criado:

Console.log (user.constructor === User); // verdadeiro

A propriedade constructor serve para identificar o tipo de um objeto. O operador instanceof permite que você faça o mesmo:

Console.log (instância do usuário do usuário); // verdadeiro

Ao usar o construtor para criar um objeto, uma cópia das propriedades e métodos é criada para cada objeto criado.

Modelo de protótipo

Quando uma função é criada, uma propriedade de protótipo é adicionada a ela por padrão. O valor da propriedade prototype é um objeto que contém propriedades e métodos gerais que estão disponíveis para todos os objetos criados usando este construtor.

Em vez de especificar propriedades e métodos no construtor, você pode especificá-los diretamente para o protótipo:

Função User () () User.prototype.name = "Homer"; User.prototype.age = "33"; User.prototype.sayHi = function () (console.log ("Olá!");); let user = new User (); console.log (user.name);

Por padrão, todos os protótipos têm apenas uma propriedade de construtor contendo uma referência à função a que se refere:

Função foo () () console.log (foo.prototype.constructor === foo); // verdadeiro

Todos os outros métodos e propriedades herdam do tipo de objeto. Ao usar o construtor para criar novo objeto, ele define um ponteiro interno (referência) para o protótipo do construtor. Esse ponteiro pode ser acessado usando o método Object.getPrototypeOf ():

Função foo () () let obj = new foo (); console.log (Object.getPrototypeOf (obj) === foo.prototype); // verdadeiro

Ao ler uma propriedade de um objeto, sua busca é iniciada. Primeira propriedade com nome especificado procurado no próprio objeto. Se for encontrado no objeto, o valor da propriedade é retornado, se o objeto não possuir uma propriedade com o mesmo nome, a busca continua no protótipo. Se uma propriedade for encontrada no protótipo, seu valor será retornado. É assim que os protótipos garantem o compartilhamento de propriedades e métodos de objetos.

Se você adicionar uma propriedade a um objeto com um nome como a propriedade prototype, então o objeto terá sua própria propriedade, neste caso, na próxima vez que a propriedade for lida, a propriedade do objeto será usada, não o protótipo.

Para escrever menos código, você pode substituir o protótipo por um objeto literal contendo todas as propriedades e métodos:

Função User () () User.prototype = (nome: "Homer", idade: 33, digaOi: function () (console.log ("Hello!");)); // Restaura a propriedade do construtor Object.defineProperty (User.prototype, "constructor", (enumerável: false, value: User));

Este exemplo define a propriedade User.prototype para um novo objeto criado com um literal. Ele substitui completamente o objeto padrão. O resultado é o mesmo do exemplo anterior, com uma exceção: a propriedade constructor não aponta mais para a função User. Adicionar explicitamente a propriedade constructor com o valor User ao literal do objeto resolve esse problema. A propriedade constructor de objetos embutidos não é enumerável por padrão, então o método Object.defineProperty () foi usado para adicioná-la.

Combinando Construtor e Padrões de Protótipo

Usando o construtor, eles definem suas próprias propriedades e, usando o protótipo, eles definem métodos e propriedades gerais:

Usuário de função (nome, idade) (this.name = name; this.age = age;) User.prototype.sayHi = function () (console.log ("Olá!");)

A flexibilidade do Javascript permite que você crie objetos de várias maneiras. Mas, como costuma acontecer, a diversidade está repleta de muitos armadilhas... Aprenda como detectar e evitar esses recifes perigosos neste artigo.

O básico do básico

É útil lembrar quais objetos estão em Javascript e como você pode criá-los. Um objeto em Javascript é apenas uma tabela hash de chaves e valores. Se os valores forem tipos de base ou outros objetos, eles são chamados propriedades, se forem funções, eles são chamados métodos objeto.

Os objetos criados pelo usuário podem ser modificados em qualquer ponto da execução do script. Muitas das propriedades dos objetos incorporados na linguagem também podem ser alteradas. Ou seja, você pode simplesmente criar um objeto vazio e adicionar propriedades e métodos a ele conforme necessário. A maneira mais fácil de fazer isso é com notação literal:
// cria um objeto vazio var cat = (); // adiciona uma propriedade: cat.name = "Garfield"; // ou método: cat.getName = function () (return cat.name;);
Outra maneira de criar um objeto é usar funções construtoras:
// notação literal: var cat = (name: "Garfield"); // função do construtor: var cat = new Object (); cat.name = "Garfield";
Obviamente, a notação literal é mais curta que o construtor. Também há uma razão filosófica para preferir a notação literal aos construtores: ela enfatiza que um objeto é apenas um hash mutável, não algo que é padronizado por uma classe.

Além disso, o uso do construtor Object força o interpretador a verificar se essa função foi substituída no contexto local.

Armadilha do construtor de objeto

Não há razão para usar o construtor Object. Mas todos nós sabemos que às vezes você tem que usar algum código antigo, caso em que é útil saber sobre uma peculiaridade deste construtor. Leva um argumento e, dependendo do seu tipo, pode instruir a criação do objeto para outro construtor embutido na linguagem; como resultado, obteremos um objeto diferente do que esperávamos:
// objeto vazio var o = new Object (); o.constructor === Object; // true var o = new Object (1); o.constructor === Número; // true var o = new Object ("string"); o.constructor === String; // verdadeiro // não esperávamos que o objeto criado tivesse este método: typeof o.substring; // "função"
Este comportamento do construtor Object pode levar a resultados inesperados se passarmos para ele um valor que é desconhecido em tempo de execução.

A moral é clara: não use o construtor Object.

Construtores personalizados

Podemos definir nossos próprios construtores. Usá-los tem a seguinte aparência:
var cat = novo gato ("Garfield"); cat.say (); // "Eu sou Garfield"
A sintaxe é semelhante à do construtor Java, mas em Javascript o construtor é uma função regular e, portanto, é definido assim:
var Cat = função (nome) (this.name = name; this.say = function () (return "Eu sou" + this.name;))
Quando esse construtor é chamado com o novo operador dentro da função, acontece o seguinte:
  • um objeto vazio é criado, apontado pela variável this; este objeto herda o protótipo da função;
  • propriedades e métodos são adicionados ao objeto armazenado neste;
  • o objeto armazenado nele é retornado implicitamente no final da função (já que não retornamos nada explicitamente).
Por uma questão de simplicidade, o exemplo adicionou um método say () a este objeto. Isso não é muito bom, pois cada vez que new Person () é chamado, ele criará na memória nova função... Como o método say () é o mesmo para todos os objetos criados com este construtor, é melhor adicioná-lo ao protótipo Cat:
Cat.prototype.say = function () (return "Eu sou" + this.name;);
Além disso, não é inteiramente correto dizer que este objeto, implicitamente criado no construtor, está vazio: ele herda do protótipo Cat, mas a discussão de protótipos está além do escopo deste artigo.

O que o construtor retorna

Ao usar o operador new, o construtor sempre retorna um objeto. Por padrão, este é o objeto referenciado por este. O construtor retorna isso implicitamente, no entanto, podemos retornar explicitamente qualquer outro objeto, por exemplo:
var Cat = function () (this.name = "Eu sou Garfield"; var that = (); that.name = "Eu sou mulher-gato"; retornar isso;); var cat = novo Cat (); cat.name // "Eu sou mulher-gato"
Assim, podemos retornar qualquer valor do construtor, mas apenas se for um objeto. Se tentarmos retornar, digamos, uma string ou false, isso não resultará em um erro, mas a instrução de retorno será ignorada e o construtor retornará isso.

Novo insidioso

Construtores são apenas funções chamadas com o novo operador. O que acontece se você esquecer essa operadora? O intérprete não emitirá avisos, mas isso levará a erros lógicos. A variável this irá apontar não para o objeto herdado do protótipo do construtor, mas para o objeto global (janela no caso de um navegador):
função Cat () (this.name = "Garfield";) // novo objeto var cat = new Cat (); tipo de gato; // "objeto" cat.name; // "Garfield" // esqueça o novo: var cat = Cat (); tipo de gato; // window.name "indefinido"; // "Garfield"
No modo estrito ECMAScript 5, isso não apontará para o objeto global neste caso. Vamos ver como você pode evitar esse erro se o ECMAScript 5 não estiver disponível.
Convenções de nomenclatura de funções
A maioria de uma forma simples a estrita observância das convenções de nomenclatura das funções é estrita: começamos as funções comuns com uma letra minúscula (myFunction ()) e as funções de construtor com uma letra maiúscula (MyConstruction ()). Infelizmente, esse método quase não o salva de nada.
Retornar um objeto explicitamente
Os construtores podem retornar qualquer objeto. Os programadores podem tirar proveito disso:
função Cat () (var that = (); that.name = "Garfield"; return that;)
O nome da variável que é arbitrário não faz parte da especificação. Podemos também nomear o objeto retornado como eu ou eu, ou o que você quiser.

Para objetos simples como o criado no exemplo, podemos fazer sem variáveis ​​adicionais usando notação literal:
função Cat () (return (name: "Garfield");)
Esse construtor sempre retornará um objeto, não importa como você o chame:
var primeiro = novo Cat (), segundo = Cat (); primeiro nome; // "Garfield" second.name; // "Garfield"
Este método tem uma séria desvantagem: o objeto não herda o protótipo do construtor, ou seja, os métodos e propriedades adicionados diretamente ao Cat não estarão disponíveis para os objetos criados com ele.

Construtor de auto-invocação
Para resolver este problema, basta verificar se este no corpo do construtor é uma instância do próprio construtor, caso contrário, chame-se novamente, mas desta vez com o novo operador. Parece assustador, mas na realidade é simples:
função Cat () (if (! (this instanceof Cat)) (return new Cat ();) this.name = "Garfield";) Cat.prototype.meow = "Meow!"; var primeiro = novo Cat (), segundo = Cat (); primeiro nome; // "Garfield" second.name; // "Garfield" first.meow; // "Miau!" second.meow; // "Miau!"
Se nosso construtor for renomeado no futuro, teremos que editar seu corpo. Você pode evitar isso verificando argumentos.callee em vez do nome do construtor:
if (! (esta instância de argumentos.callee)) (retornar novos argumentos.callee ();)
Aqui, aproveitamos o fato de que, dentro de cada função, é criado um objeto de argumentos que contém todos os parâmetros passados ​​para a função no momento da chamada. A propriedade callee deste objeto aponta para a função a ser chamada. Mas aqui também você precisa ter cuidado: o modo estrito ECMAScript 5 gera um TypeError ao acessar essa propriedade, portanto, vale a pena decidir com antecedência entre a conveniência de refatoração e um amanhã brilhante.

Em vez de uma conclusão

Javascript é uma linguagem incrível. É muito fácil de aprender e as estruturas existentes permitirão que você o use facilmente em seus projetos. Mas a simplicidade da sintaxe esconde recifes de armadilhas - e ferramentas muito poderosas. Às vezes, é útil olhar o que está lá embaixo.

JavaScript fornece aos desenvolvedores a capacidade de criar e trabalhar com objetos. Para isso, existem as seguintes técnicas:

  • Nova operadora
  • Notação literal
  • Construtores de objetos
  • Matrizes associativas

Usando o novo operador

Este é provavelmente o mais jeito fácil criando um objeto. Você acabou de criar o nome do objeto e igualá-lo a um novo Objeto Javascript.

// Cria nosso objeto var MyObject = new Object (); // Variáveis ​​MyObject.id = 5; // Número MyObject.name = "Amostra"; // String // Funções MyObject.getName = function () (return this.name;)

Menos este métodoé que você só pode trabalhar com um objeto recém-criado.

// Use nosso alerta de objeto (MyObject.getName ());

Notação literal

A notação literal é uma forma um tanto incomum de definir novos objetos, mas fácil de entender. A notação literal funciona desde o Javascript 1.3.

// Crie nosso objeto usando a notação literal MyObject = (id: 1, name: "Sample", boolval: true, getName: function () (return this.name;))

Como você pode ver, é muito simples.

Objeto = (id: valor, ...)

E um exemplo de uso:

Alerta (MyObject.getName ());

Construtores de objetos

Os construtores de objetos são ferramentas poderosas para a criação de objetos que podem ser reutilizados continuamente. Um construtor de objeto é, na verdade, um construtor comum Função Javascript, que também pode receber vários parâmetros.

Função MyObject (id, nome) ()

Acabamos de escrever um construtor. Com a ajuda dele, criaremos nosso objeto.

Var MyFirstObjectInstance = new MyObject (5, "Amostra"); var MySecondObjectInstace = new MyObject (12, "Outra amostra");

Assim, criamos várias instâncias do objeto. Agora podemos trabalhar separadamente com cada instância do MyObject, sem medo de que, ao alterar as propriedades de uma instância, afetemos as propriedades de outra instância.

Como em OOP, MyObject pode ter métodos e várias propriedades. As propriedades podem ser atribuídas a valores padrão ou valores fornecidos pelo usuário no construtor do objeto.

Função MyObject (id, name) (// Valores fornecidos pelo usuário this._id = id; this._name = name; // Valor padrão this.defaultvalue = "(! LANG: MyDefaultValue"; } !}

Podemos criar funções da mesma maneira.

Função MyObject (id, name) (this._id = id; this._name = name; this.defaultvalue = "(! LANG: MyDefaultValue"; //Получение текущего значения this.getDefaultValue = function() { return this.defaultvalue; } //Установка нового значения this.setDefaultValue = function(newvalue) { this.defaultvalue = newvalue; } //Произвольная функция this.sum = function(a, b) { return (a+b); } } !}

Matrizes associativas

Um método semelhante será útil para ordenar um grande número de objetos do mesmo tipo.

Var MeuObjeto = novo número (); MeuObjeto ["id"] = 5; MyObject ["name"] = "SampleName";

Para atravessar esses objetos, você pode usar o seguinte loop:

For (MyElement in MyObject) (// Código de ignorar // In MyElement - identificador de registro // In MyObject - conteúdo do registro)

Um pequeno diagrama foi preparado com base no material.

Você pode assistir em formatos.

Função Pessoa (primeiro, último, idade, olho) (this.firstName = first; this.lastName = last; this.age = age; this.eyeColor = eye;)

É considerada uma boa prática de programação colocar o nome de uma função construtora em maiúscula.

Tipos de objeto (modelos) (classes)

Os exemplos dos capítulos anteriores são consideravelmente limitados. Apenas objetos únicos são criados neles.

No entanto, às vezes é necessário ter um certo "modelo" pelo qual seria possível criar muitos objetos do mesmo "tipo".

Para criar um "tipo de objeto" e usar função de construtor de objeto.

No exemplo do início deste capítulo, a função Pessoa ()é uma função construtora de um objeto.

Objetos do mesmo tipo são criados chamando a função construtora com a palavra-chave novo:

Var meuPai = nova pessoa ("John", "Doe", 50, "blue"); var minhaMãe = nova pessoa ("Sally", "Rally", 48, "verde");

Esta palavra-chave

Em JavaScript palavra-chave isto denota o objeto que "possui" este código.

Valor da palavra-chave isto quando é usado em um objeto, o próprio objeto é.

Na função construtora, a palavra-chave isto nenhum valor. Esta é uma "substituição" para um novo objeto. Quando um novo objeto é criado, o valor da palavra-chave isto e este novo objeto se tornará.

Observe que isto não é uma variável, mas uma palavra-chave. Você não pode alterar seu valor.

Adicionando uma propriedade a um objeto

É muito fácil adicionar uma nova propriedade a um objeto existente:

MyFather.nationality = "Inglês";

A propriedade será adicionada ao objeto myFather, mas não ao objeto myMother. (Ou alguma outra pessoa).

Adicionando um método a um objeto

Adicionar novo método a um objeto existente é muito simples:

MeuPai.name = function () (retornar this.firstName + "" + this.lastName;);

O método será adicionado ao objeto myFather, mas não ao objeto myMother. (Ou alguma outra pessoa).

Adicionar uma propriedade ao construtor de um objeto

Você não pode adicionar uma nova propriedade ao construtor de um objeto da mesma forma que faria com um objeto existente.

Para adicionar uma nova propriedade ao construtor, você deve adicioná-la à função do construtor:

Função Pessoa (primeiro, último, idade, cor dos olhos) (this.firstName = first; this.lastName = last; this.age = age; this.eyeColor = eyecolor; this.nationality = "Inglês";)

Nesse caso, as propriedades do objeto podem ser definidas para os valores padrão.

Adicionar um método ao construtor de um objeto

Uma função construtora também pode definir métodos:

Função Pessoa (primeiro, último, idade, cor dos olhos) (this.firstName = first; this.lastName = last; this.age = age; this.eyeColor = eyecolor; this.name = function () (retornar this.firstName + " "+ this.lastName;);)

Você não pode adicionar novos métodos ao construtor de um objeto da mesma forma que faria com um objeto existente. A adição de métodos a um objeto deve ocorrer dentro de uma função construtora:

Função Pessoa (firstName, lastName, age, eyeColor) (this.firstName = firstName; this.lastName = lastName; this.age = age; this.eyeColor = eyeColor; this.changeName = function (name) (this.lastName = name ;);)

A função changeName () atribui o valor do parâmetro name à propriedade lastName do objeto pessoa:

MyMother.changeName ("Doe");

JavaScript sabe de qual objeto está falando, "substituindo-o" na palavra-chave isto um objeto minha mãe.

Construtores de JavaScript integrados

JavaScript tem construtores integrados para objetos nativos:

Var x1 = novo objeto (); // Novo objeto var x2 = new String (); // Novo objeto String var x3 = new Number (); // Novo objeto Number var x4 = new Boolean (); // Novo objeto booleano var x5 = new Array (); // Novo objeto Array var x6 = new RegExp (); // Novo objeto RegExp var x7 = new Function (); // Novo objeto de função var x8 = new Date (); // Novo objeto Date

Não há objeto Math () nesta lista porque é um objeto global. A nova palavra-chave não pode ser usada com o objeto Math.

Você sabia?

Como você pode ver no código acima, JavaScript tem versões de objeto dos tipos de dados primitivos String, Number e Boolean. No entanto, não há razão para criar objetos complexos para esses tipos. Os valores primitivos são mais rápidos.

Desse modo:

  • usar literais de objeto { } em vez de new Object ().
  • usar literais de string "" em vez de new String ().
  • use literais numéricos 12345 em vez do novo número ().
  • use literais booleanos verdadeiro falso em vez de new Boolean ().
  • use literais de array em vez de new Array ().
  • usar literais de modelo /()/ em vez de novo RexExp ().
  • usar expressões de função () {} em vez de new Function ().
var x1 = (); // novo objeto var x2 = ""; // nova string primitiva var x3 = 0; // novo número primitivo var x4 = false; // novo booleano primitivo var x5 =; // novo objeto Array var x6 = / () / // novo objeto RegExp var x7 = function () (); // novo objeto Function

conteúdo movido de snippets para artigos

Usando o novo operador, você pode criar um objeto (objeto de função).
O novo operador deve ser seguido pelo nome da função construtora; esta função construtora inicializa as propriedades do objeto.
A palavra-chave this é passada para a função construtora, que se refere ao objeto recém-criado.

Existem construtores javascript integrados como: Array (), Date (), RegExp (). É importante notar que o construtor Object () cria um objeto vazio, que é o mesmo que usar o objeto literal ().

ProtótipoÉ o valor da propriedade prototype da função do construtor. Cada função tem uma propriedade de protótipo, esta propriedade se refere a um objeto de protótipo predefinido. Este objeto só funciona se a função for utilizada como construtor, ou seja, em conjunto com o operador new.

Cada objeto possui uma propriedade construtora; esta propriedade se refere a uma função construtora que, conforme discutido acima, inicializa as propriedades do objeto.

Como você pode ver, a propriedade r_method sempre se refere a uma função imutável (em oposição às propriedades exclusivas de cada objeto). Portanto, é mais racional adicioná-lo ao protótipo. Podemos fazer uma conclusão simples: um objeto de protótipo é o lugar certo para constantes e métodos. Uma vez que qualquer objeto herda as propriedades de seu protótipo, nossa função (r_method) será automaticamente adicionada a todos os objetos inicializados pelo construtor (example_constr).

Aulas de Javascript

Javascript não oferece suporte a classes como tais. No entanto, você pode criar pseudo-classes usando funções de construtor e protótipos de objeto. Um construtor é uma classe.

O objetivo de um construtor é criar um novo objeto, definir e retorná-lo como um valor de construtor.

O nome de um construtor é geralmente um substantivo, maiúscula e descreve o objeto que está sendo construído. Construtores são normalmente usados ​​para criar objetos que correspondem ao mesmo padrão.

Um exemplo de criação de um objeto,
definição de construtor,
e definindo uma propriedade para o protótipo:

// objeto var opa = (); var opa_ = (x: 0, y: "sim") var D = nova data (); // data atual / * propriedade do construtor * / document.write (D.constructor); // function Date () () D.constructor == Date // true // define o construtor: function example_constr (r, t) (this.ad = r; this.ak = t; // método, mas melhor definido como propriedade de protótipo / * this.r_method = function () (this.qu = this.ad - this.ak;) * / // método, mas dentro do método não usamos propriedades de objeto this.a_method = function (x, y) (alert (x + y);)) // declara o método (r_method) no protótipo // é preferível usar r_method em construtor f-i// devido ao fato de que a função r_method não tem propriedades exclusivas, em contraste // com as propriedades acima (ad, ak) example_constr.prototype.r_method = function () (this.qu = this.ad - this. ak ;) // chama o construtor e cria um objeto example_constr (krot) var krot = new example_constr (14,15); // que é equivalente a krot = (ad: 14, ak: 15) krot.r_method (); // imprime: //alert(krot.qu); // -1 //krot.a_method(11,11); // irá gerar: // 22

Adição:
Para criar seu próprio construtor, basta descrever uma função em que a palavra-chave this se referirá a objetos (que são criados através da função construtora). Veja acima para example_constr.

console.dir

js

console.dir (obj); // exibirá todas as propriedades do objeto no console

Objetos em javascript permitem que você recrie o conceito de programação orientada a objetos

Para criar objetos um tipo usar funções de construtor. A diferença entre um construtor e uma função regular é que o construtor é chamado por meio do operador especial new.

Ao usar new em uma função de construtor, return só pode retornar um objeto, e esse objeto substituirá o padrão this.

Variáveis ​​e funções privadas

A função construtora pode ser como dados privados(o código externo pode receber esses dados, mas não pode mudar) e público.

javascript

// define um construtor: function example_constr (r, t, name) (// this = () é criado automaticamente this.ad = r; this.ak = t; this.a_method = function (x, y) (alert ( x + y);) // função de construtor e sem qualquer retorno // retorna o objeto esta // variável privada (ou seja, pode ser obtida de código externo, // mas não pode ser alterada): this.getName = function ( ) (return name;) // você também pode usar variáveis ​​comuns, // que estarão disponíveis apenas na função do construtor: var page, password; var ogo = function () (// ......... .......);) var newObj = new example_constr (1,2, "Vasya"); console.dir (novoObj); console.log (newObj.getName ()); //

conhecer

  • OBJETOS Javascript só funcionam com propriedades de string, ou seja, se uma propriedade não for especificada como string, ela ainda se tornará uma string.