Em PHP / Java, pode-se fazer:
class Sub extends Base
{
}
E automaticamente todos os métodos públicos / protegidos, propriedades, campos, etc. da classe Super tornam-se parte da classe Sub, que pode ser substituída se necessário.
Qual é o equivalente para isso em Javascript?
javascript
oop
Clique em votar positivamente
fonte
fonte
Respostas:
Mudei a forma como faço isso agora, tento evitar o uso de funções construtoras e suas
prototype
propriedades, mas minha antiga resposta de 2010 ainda está no final. Agora eu prefiroObject.create()
.Object.create
está disponível em todos os navegadores modernos.Devo observar que
Object.create
geralmente é muito mais lento do que usarnew
com um construtor de função.jsfiddle
Um dos grandes benefícios de usar Object.create é ser capaz de passar um argumento defineProperties , que dá a você um controle significativo sobre como as propriedades na classe podem ser acessadas e enumeradas, e também uso funções para criar instâncias, que servem como construtores de certa forma, já que você pode fazer a inicialização no final em vez de apenas retornar a instância.
jsfiddle
Esta é minha resposta original de 2010:
fonte
alert()
para ver o queinstance.showColor()
retorna, ainda receboundefined
. jsbin.com/uqalin/1Em JavaScript, você não tem classes, mas pode obter herança e reutilização de comportamento de várias maneiras:
Herança pseudo-clássica (por meio de prototipagem):
Deve ser usado com o
new
operador:Aplicação de função ou "encadeamento de construtor":
Essa abordagem também deve ser usada com o
new
operador:A diferença com o primeiro exemplo é que quando colocamos
apply
oSuper
construtor nothis
objeto internoSub
, ele adiciona as propriedades atribuídas athis
onSuper
, diretamente na nova instância, por exemplo,subInstance
contém as propriedadesmember1
emember2
diretamente (subInstance.hasOwnProperty('member1') == true;
).No primeiro exemplo, essas propriedades são alcançadas através da cadeia de protótipos , elas existem em um
[[Prototype]]
objeto interno .Herança parasitária ou construtores de energia:
Esta abordagem é baseada basicamente no "aumento do objeto", você não precisa usar o
new
operador e, como você pode ver, athis
palavra-chave não está envolvida.ECMAScript 5th Ed.
Object.create
método:O método acima é uma técnica de herança prototípica proposta por Crockford .
Instâncias de objeto herdam de outras instâncias de objeto, é isso.
Esta técnica pode ser melhor do que simples "aumento do objeto", porque as propriedades herdadas não são copiados sobre todos os novos casos de objeto, uma vez que a base de objeto é definido como a
[[Prototype]]
da alargada objeto, no exemplo acimasubInstance
contém fisicamente somente amember3
propriedade.fonte
Object.create()
ou umaclone()
função personalizada (por exemplo, mercurial.intuxication.org/hg/js-hacks/raw-file/tip/clone.js ) para herdar diretamente do objeto de protótipo; veja os comentários em stackoverflow.com/questions/1404559/… para uma explicaçãoObject.create
método :)member1
variável, o que não é desejável de forma alguma. Claro que eles podem reescrever, mas isso simplesmente não faz sentido. github.com/dotnetwise/Javascript-FastClass é a melhor solução de açúcar.Sub.prototype = new Super();
. E se as duas classes nunca forem usadas durante a execução do script? Parece um problema de desempenho. Por que preciso criar uma classe pai se a classe filha não é realmente usada? Você pode explicar, por favor? Aqui está uma demonstração simples do problema: jsfiddle.net/slavafomin/ZeVL2 Obrigado!Para quem chegar a esta página em 2019 ou depois
Com a versão mais recente do padrão ECMAScript (ES6) , você pode usar a palavra-chave
class
.Observe que a definição da classe não é regular
object
; portanto, não há vírgulas entre os membros da classe. Para criar uma instância de uma classe, você deve usar anew
palavra - chave. Para herdar de uma classe base, useextends
:Para herdar de uma classe base, use
extends
:A partir da classe derivada, você pode usar super de qualquer construtor ou método para acessar sua classe base:
super().
super.getName()
,.Há mais coisas sobre o uso de classes. Se você quiser se aprofundar no assunto, recomendo " Classes in ECMAScript 6 ", do Dr. Axel Rauschmayer. *
fonte
fonte
class
eextends
é (ultra útil) a sintaxe de açúcar para a cadeia de protótipo: stackoverflow.com/a/23877420/895245Bem, em JavaScript não há "herança de classe", há apenas "herança de protótipo". Então você não faz uma classe "caminhão" e a marca como uma subclasse de "automóvel". Em vez disso, você faz um objeto "Jack" e diz que ele usa "John" como protótipo. Se John sabe quanto é "4 + 4", então Jack também sabe.
Eu sugiro que você leia o artigo de Douglas Crockford sobre herança de protótipos aqui: http://javascript.crockford.com/prototypal.html Ele também mostra como você pode fazer com que o JavaScript tenha uma herança "semelhante" a outras linguagens OO e então explica que isso na verdade, significa quebrar o javaScript de uma maneira que não deveria ser usado.
fonte
Acho esta citação a mais esclarecedora:
Gosto de usar construtores em vez de objetos, portanto, gosto do método de "herança pseudo-clássica" descrito aqui pelo CMS . Aqui está um exemplo de herança múltipla com uma cadeia de protótipo :
Aqui está outro bom recurso do MDN , e aqui está um jsfiddle para que você possa experimentá-lo .
fonte
A herança do Javascript é um pouco diferente do Java e do PHP, porque realmente não tem classes. Em vez disso, ele possui objetos de protótipo que fornecem métodos e variáveis de membro. Você pode encadear esses protótipos para fornecer herança de objeto. O padrão mais comum que encontrei ao pesquisar essa questão é descrito na Mozilla Developer Network . Eu atualizei o exemplo deles para incluir uma chamada para um método da superclasse e para mostrar o log em uma mensagem de alerta:
Pessoalmente, acho a herança em Javascript estranha, mas esta é a melhor versão que encontrei.
fonte
você não pode (no sentido clássico). Javascript é uma linguagem prototípica. Você observará que nunca declara uma "classe" em Javascript; você simplesmente define o estado e os métodos de um objeto. Para produzir herança, você pega um objeto e o protótipo. O protótipo é estendido com novas funcionalidades.
fonte
Você pode usar
.inheritWith
e.fastClass
biblioteca . É mais rápido do que a maioria das bibliotecas populares e às vezes até mais rápido do que a versão nativa.Muito fácil de usar:
Uso
fonte
fonte
Depois de ler muitos posts, eu encontrei essa solução ( jsfiddle aqui ). Na maioria das vezes eu não preciso de algo mais sofisticado
fonte
Graças à resposta do CMS e depois de mexer um pouco com prototype e Object.create e tudo o mais, consegui chegar a uma solução bacana para minha herança usando aplicar como mostrado aqui:
fonte
A partir do ES2015, é exatamente assim que você faz herança em JavaScript
fonte
fonte
Aulas ES6:
Javascript não possui classes. As classes em javascript são apenas açúcar sintático construído em cima do padrão de herança prototípico que o javascript. Você pode usar o JS
class
para impor a herança prototípica, mas é importante perceber que, na verdade, você ainda está usando funções de construtor nos bastidores.Esses conceitos também se aplicam quando você está estendendo de uma
es6
'classe' usando a palavra-chave extends. Isso apenas cria um link adicional na cadeia de protótipo. o__proto__
Exemplo:
Object.create ()
Object.create()
também é uma forma de criar herança em JS em javascript.Object.create()
é uma função que cria um novo objeto, e toma um objeto existente como argumento. Ele atribuirá o objeto que foi recebido como um argumento à__proto__
propriedade do objeto recém-criado. Novamente, é importante perceber que estamos vinculados ao paradigma de herança prototípico que JS incorpora.Exemplo:
fonte
Você não pode herdar de uma classe em JavaScript, porque não há classes em JavaScript.
fonte