O conceito de herança de js
Os dois métodos de herança a seguir comumente usados em JS:
Herança da cadeia de protótipo (herança entre objetos)
Herança clássica (herança entre construtores)
Como o JS não é uma linguagem verdadeiramente orientada a objetos, como o Java, o JS é baseado em objetos e não possui conceito de classes. Portanto, se você deseja implementar a herança, poderá usar o mecanismo de protótipo de protótipo de JS ou usar os métodos de aplicação e chamada para implementá -lo
Em uma linguagem orientada a objetos, usamos classes para criar um objeto personalizado. No entanto, tudo no JS é um objeto, então qual método pode ser usado para criar um objeto personalizado? Isso requer o protótipo JS:
Podemos simplesmente considerar o protótipo como um modelo. Os objetos personalizados recém -criados são uma cópia deste modelo (protótipo) (na verdade não é uma cópia, mas um link, mas esse tipo de link é invisível. Há um ponteiro __proto__ invisível dentro do objeto recém -instanciado, apontando para o objeto protótipo).
O JS pode simular e implementar as funções das classes por meio de construtores e protótipos. Além disso, a implementação da herança do tipo JS também é alcançada, contando com cadeias de protótipo.
Herança de protótipo e herança de classe
A herança clássica é o chamado de um construtor de supertipo dentro do construtor de subtipo.
A herança rigorosa da classe não é muito comum e geralmente é usada em combinação:
A cópia do código é a seguinte:
função super () {
this.colors = ["vermelho", "azul"];
}
função sub () {
Super.call (this);
}
A herança do protótipo é criar um novo objeto com a ajuda dos objetos existentes e apontar o protótipo da subclasse à classe pai, o que equivale a adicionar a cadeia de protótipo da classe pai.
Herança da cadeia de protótipo
Para que uma classe infantil herde as propriedades da classe pai (incluindo métodos), um construtor é primeiro necessário para definir. Em seguida, atribua uma nova instância da classe pai ao protótipo do construtor. O código é o seguinte:
A cópia do código é a seguinte:
<Cript>
função parent () {
this.name = 'Mike';
}
função child () {
this.age = 12;
}
Child.Prototype = new Parent (); // Child herda pai e forma uma cadeia através do protótipo.
var teste = new Child ();
alerta (test.age);
alerta (test.name); // obtém atributos herdados
// continua a herdar a cadeia de protótipo
função irmão () {// Brother construto
this.weight = 60;
}
Irmão.prototype = new Child (); // continua a protótipo da herança da cadeia
var irmão = novo irmão ();
alerta (irmão.name); // herdar pai e filho, Mike aparece
alerta (irmão.age); // pop 12
</script>
A herança da cadeia de protótipo acima ainda está faltando um link, ou seja, o objeto e todos os construtores são herdados do objeto. O objeto herdador é concluído automaticamente e não requer herança manual por nós mesmos. Então, qual é o relacionamento subordinado deles?
Determinar a relação entre protótipo e instância
Existem duas maneiras de determinar a relação entre um protótipo e uma instância. Instância do operador e isPrototypeof () Métodos:
A cópia do código é a seguinte:
alerta (instância do irmão do objeto) // true
alerta (instância de teste de irmão); // false, teste é a superclasse do irmão
alerta (instância do irmão da criança); // true
alerta (instância do irmão do pai); // true
Desde que seja um protótipo que apareça na cadeia de protótipo, pode -se dizer que é o protótipo da instância derivada da cadeia de protótipo. Portanto, o método isProTypeOf () também retornará true.
No JS, a função herdada é chamada de supertipo (classe pai, classe base e também) e a função herdada é chamada de subtipo (subclasse, classe derivada). O uso da herança do protótipo envolve principalmente duas questões:
Primeiro, a reescrita literal de protótipos quebrará o relacionamento, usará o protótipo do tipo de referência e o subtipo não pode passar parâmetros para o supertipo.
A pseudo-classe resolve o problema do compartilhamento de referência e dos supertipo não conseguirem aprovar argumentos. Podemos usar a tecnologia "Construtor de Empréstimos".
Construtor de empréstimos (herança clássica)
A cópia do código é a seguinte:
<Cript>
função pai (idade) {
this.name = ['Mike', 'Jack', 'Smith'];
this.age = idade;
}
função criança (idade) {
Parent.call (isto, idade);
}
var teste = novo filho (21);
alerta (test.age); // 21
alerta (test.name); // Mike, Jack, Smith
test.name.push ('Bill');
alerta (test.name); // Mike, Jack, Smith, Bill
</script>
Embora os construtores de empréstimos resolvam os dois problemas agora, sem protótipos, não há como reutilizar, por isso precisamos de uma cadeia de protótipo + padrão de construtor de emprestado. Esse padrão é chamado de herança combinada.
Herança combinada
A cópia do código é a seguinte:
<Cript>
função pai (idade) {
this.name = ['Mike', 'Jack', 'Smith'];
this.age = idade;
}
Parent.prototype.run = function () {
Retorne this.name + 'são' + this.age;
};
função criança (idade) {
Parent.call (this, idade); // objeto representa e passa parâmetros para supertipo
}
Child.prototype = new Parent (); // Herança da cadeia de protótipo
var teste = novo filho (21); // escrever um novo pai (21) está ok
alerta (test.run ()); // Mike, Jack, Smith são ambos 21
</script>
A herança combinada é um método de herança relativamente comumente usado. A idéia por trás dela é usar a cadeia de protótipos para implementar a herança de propriedades e métodos do protótipo e implementar a herança das propriedades de instância por emprestando construtores. Dessa maneira, a multiplexação da função é alcançada pela definição de métodos no protótipo e garantindo que cada instância tenha suas próprias propriedades.
Uso de Call (): Chame um método de um objeto e substitua o objeto atual por outro objeto.
A cópia do código é a seguinte:
Call ([thisObj [, arg1 [, arg2 [, [, .argn]]]]))
Herança de protótipo
Essa maneira de herdar a criação de novos objetos com base em objetos existentes sem criar tipos personalizados é chamada de herança de protótipo
A cópia do código é a seguinte:
<Cript>
função obj (o) {
função f () {}
F.Prototype = O;
retornar novo f ();
}
var caixa = {
Nome: 'trigkit4',
arr: ['irmão', 'irmã', 'baba']
};
var b1 = obj (caixa);
alerta (b1.name); // trigkit4
b1.name = 'Mike';
alerta (b1.name); // mike
alerta (b1.arr); // irmão, irmã, Baba
b1.arr.push ('pais');
alerta (b1.arr); // irmão, irmã, baba, pais
var b2 = obj (caixa);
alerta (b2.name); // trigkit4
alerta (b2.arr); // irmão, irmã, Baba, pais
</script>
A herança do protótipo primeiro cria um construtor temporário dentro da função Obj () e, em seguida, usa o objeto passado como o protótipo do construtor e finalmente retorna uma nova instância desse tipo temporário.
Herança parasitária
Esse método de herança combina o modelo de protótipo + fábrica, com o objetivo do processo de criação de encapsulamento.
A cópia do código é a seguinte:
<Cript>
função create (o) {
var f = obj (o);
f.run = function () {
devolver isso.arr; // Da mesma forma, as referências serão compartilhadas
};
retornar f;
}
</script>
Pequenos problemas com herança combinada
A herança combinada é o modo de herança mais comumente usado em JS, mas o supertipo de herança combinado será chamado duas vezes durante o uso; Uma vez é a criação de um subtipo e o outro está dentro do construtor de subtipo.
A cópia do código é a seguinte:
<Cript>
função pai (nome) {
this.name = nome;
this.arr = ['irmão', 'irmã', 'pais'];
}
Parent.prototype.run = function () {
retornar este.name;
};
função criança (nome, idade) {
Parent.call (isto, idade); // a segunda chamada
this.age = idade;
}
Child.prototype = new Parent (); // A primeira chamada
</script>
O código acima é a herança de combinação anterior; portanto, a herança de combinação parasitária resolve o problema de duas chamadas.
Herança de combinação parasita
A cópia do código é a seguinte:
<Cript>
função obj (o) {
função f () {}
F.Prototype = O;
retornar novo f ();
}
função create (pai, teste) {
var f = obj (parent.prototype); // cria um objeto
f.Constructor = teste; // Objeto aprimorado
}
função pai (nome) {
this.name = nome;
this.arr = ['irmão', 'irmã', 'pais'];
}
Parent.prototype.run = function () {
retornar este.name;
};
função criança (nome, idade) {
Parent.call (este, nome);
this.age = idade;
}
herdprototipo (pai, filho); // a herança é realizada por aqui
var teste = novo filho ('trigkit4', 21);
test.arr.push ('sobrinho');
alerta (test.arr); //
alerta (test.run ()); // apenas o método é compartilhado
var test2 = new Child ('Jack', 22);
alerta (test2.arr); // Resolva o problema da citação
</script>
ligue e aplique
As funções globais se aplicam e a chamada pode ser usada para alterar o apontamento disso na função, como segue:
A cópia do código é a seguinte:
// define uma função global
function foo () {
console.log (this.fruit);
}
// define uma variável global
var frut = "maçã";
// Personalize um objeto
var pack = {
Frutas: "Orange"
};
// equivalente a window.foo ();
foo.Apply (janela); // "maçã", isso é igual à janela
// this === pacote em foo
foo.Apply (pack); // "laranja"