O que é um protótipo em JavaScript

JavaScript é uma linguagem dinâmica e baseada em protótipo, portanto, os protótipos são um dos conceitos mais importantes de JavaScript. Vamos primeiro discutir por que precisamos de protótipos.

Por que precisamos de protótipos?

Como mencionado anteriormente, JavaScript é uma linguagem dinâmica, o que significa que podemos adicionar propriedades a um objeto sempre que quiser. Vamos seguir um exemplo para explicar isso:

função player ()
esse.nome = 'perigo';
esse.Club = 'Chelsea';

var player1 = new player ();
jogador1.idade = 30;
Alerta (Player1.idade);
var player2 = new player ();
Alerta (Player2.idade);

Neste exemplo, demos outra propriedade ao Player de Objeto. No entanto, o primeiro objeto I-E Player1 terá uma propriedade de idade, mas não o segundo objeto i-e player2. A razão para isso é que a propriedade AGE é definida apenas para o objeto Player1.

Podemos ver o objeto Player2 mostra indefinidos na saída abaixo do exemplo acima:

Agora que sabemos que problema estamos enfrentando, surge a pergunta: qual é a solução? A solução para esse problema é "protótipo".

Solução

Protótipos são um recurso interno do JavaScript. Cada vez que você cria uma função JavaScript, JavaScript adiciona automaticamente um protótipo a essa função. Podemos dizer que um protótipo é um objeto que permite adicionar novas propriedades a um objeto existente. Em resumo, os protótipos contêm uma classe base de todos os objetos, ajudando -nos a alcançar a herança.

Podemos anexar propriedades adicionais ao objeto de protótipo que será compartilhado em todas as instâncias.

Agora usaremos a propriedade Prototype no exemplo acima para resolver o problema de compartilhar a propriedade da idade com todos os objetos i-e player1 e player2.

função player ()
esse.nome = 'perigo';
esse.Club = 'Chelsea';

Jogador.protótipo.idade = 30;
var player1 = new player ();
Alerta (Player1.idade);
var player2 = new player ();
Alerta (Player2.idade);

Veremos que as idades dos dois jogadores serão 30 agora. A saída é mostrada abaixo:

Simplificando, o protótipo de propriedade do JavaScript nos ajuda a adicionar novas propriedades aos construtores de objetos, como mostrado no exemplo acima.

Propritipo de propriedade de um objeto

Todo objeto que é iniciado usando a sintaxe literal ou iniciado usando a sintaxe do construtor usando a nova palavra -chave, inclui __proto__ propriedade. Isso apontará para o objeto de protótipo que criou este objeto.

Se você deseja ver a propriedade do protótipo de um objeto, podemos vê -lo na ferramenta de desenvolvedor de depuração. No exemplo abaixo, nós o implementamos e o veremos na janela do console.

Exemplo

função player ()
esse.nome = 'perigo';
esse.Club = 'Chelsea';

var playerObject = new Player ();
// Janela do console
console.log (jogador.protótipo);
console.log (PlayerObject.protótipo);
console.log (PlayerObject.__proto__);
console.log (typeof player);
console.registro();

Neste exemplo, podemos ver que a propriedade Prototype de função é acessada usando o nome da função que é jogador.protótipo.

Também podemos ver neste exemplo que a propriedade do protótipo não está exposta ao objeto, só podemos acessá -lo usando o “__proto__”.

Protótipo do objeto

No exemplo anterior, vimos que a propriedade do protótipo de objeto é indefinida, o que significa que é invisível. Podemos usar o objeto.getPrototypeOf (OBJ) Método em vez do que usamos i-e “__proto__”. Com isso, não será indefinido e poderemos acessar o objeto de protótipo.

função player ()
esse.nome = 'perigo';
esse.Club = 'Chelsea';

var playerObject = new Player ();
Jogador.protótipo.selecionado = function ()
alerta ("selecionado para a equipe de hoje");

var player1 = new player ();
var checkingproto = objeto.getPrototypeof (player1);
// Isso retornará o objeto de protótipo do Player1
Alerta (checkingproto.construtor);
// Isso retornará a função do jogador1 que é selecionado

Conclusão

Neste artigo, discutimos principalmente o conceito básico de protótipos em JavaScript. Nós nos aprofundamos um pouco mais e discutimos o que é um protótipo em JavaScript. Também discutimos um problema e demos a solução usando o protótipo. Além disso, discutimos para encontrar propriedades e métodos de objeto em javascript usando protótipos. Tudo isso foi demonstrado com a ajuda de exemplos para desenvolver uma melhor compreensão do conceito.