Existem várias maneiras comuns de definir classes ou objetos em JavaScript: abordagem de fábrica
function createCar(cor, portas, mpg){
var tempCar = novo objeto;
tempCar.color = cor;
tempCar.doors = portas;
tempCar.mpg = mpg;
tempCar.showColor= função (){
alerta( este .color);
};
retornar tempCar;
}
var car1 = createCar("vermelho", 4, 23);
var car2 = createCar("azul", 3, 25);
car1.showColor();
car2.showColor();
Definida uma função de fábrica que pode criar e retornar objetos de um tipo específico. Parece bom, mas há um pequeno problema. Uma nova função showColor deve ser criada sempre que for chamada. função mostrarCor(){ alerta(esta.cor); } Aponte para ele diretamente na função de fábrica tempCar.showColor = showColor; Isso evita o problema de criar funções repetidamente, mas não parece um método de objeto. Modo construtor
função Carro(sColor, iDoors, iMpg){
este .color = sColor;
isto .doors = iDoors;
este .mpg = iMpg;
este .showColor = função (){
alerta( este .color);
};
}
var carro1 = novo Carro("vermelho", 4, 23);
var carro2 = novo Carro("azul", 3, 25);
car1.showColor();
car2.showColor();
Você pode ver a diferença no primeiro método. Não há nenhum objeto criado dentro do construtor, mas a palavra-chave this é usada. Ao chamar o construtor usando new, um objeto é primeiro criado e depois acessado usando this. Este uso é muito semelhante a outras linguagens orientadas a objetos, mas este método tem o mesmo problema do anterior, que é criar funções repetidamente. Uma abordagem híbrida de construtor/protótipo para construção
Este método usa o método construtor e o método protótipo ao mesmo tempo. Combinando suas vantagens, o método construtor foi apresentado antes. função Carro(){
}
Car.prototype.color = "vermelho";
Carro.protótipo.portas = 4;
Carro.protótipo.mpg = 23;
Car.prototype.showColor= função (){
alerta( este .color);
};
var carro1 = novo Carro();
var carro2 = novo Carro();
Primeiro, o construtor Car é definido sem nenhum código e depois as propriedades são adicionadas através do protótipo vantagem: a. Todas as instâncias armazenam ponteiros para showColor, o que resolve o problema de criação repetida de funções. b. Você pode usar instanceof para verificar o tipo de objeto. alert(car1 instância do carro); //true Desvantagens, adicione o seguinte código:
Car.prototype.drivers = new Array("mike", "sue");
car1.drivers.push("matt");
alert(car1.drivers); //saída "mike,sue,matt"
alert(car2.drivers); //saída "mike,sue,matt"
drivers são ponteiros para objetos Array e ambas as instâncias de Car apontam para o mesmo array.
Vamos usar o seguinte método de mistura: função Carro(sColor, iDoors, iMpg){
este .color = sColor;
isto .doors = iDoors;
este .mpg = iMpg;
this .drivers = new Array("mike", "sue");
}
Car.prototype.showColor= função (){
alerta( este .color);
};
var carro1 = novo Carro("vermelho", 4, 23);
var carro2 = novo Carro("azul", 3, 25);
car1.drivers.push("matt");
alerta(car1.drivers);
alerta(car2.drivers);
Desta forma não há problema, e você também pode usar instanceof prototipagem dinâmica
função Carro(sColor, iDoors, iMpg){
este .color = sColor;
isto .doors = iDoors;
este .mpg = iMpg;
this .drivers = new Array("mike", "sue");
if ( typeof Car.initialized == "indefinido"){
Car.prototype.showColor= função (){
alerta( este .color);
};
Car.initializado = verdadeiro ;
}
}
var carro1 = novo Carro("vermelho", 4, 23);
var carro2 = novo Carro("azul", 3, 25);
car1.drivers.push("matt");
alerta(car1.drivers);
alerta(car2.drivers);
Este método é o meu favorito. Todas as definições de classe são concluídas em uma função. Parece muito com as definições de classe em outras linguagens.