Código simple de Javascript para comprender los conceptos básicos de OOP basados ​​en prototipos [cerrado]


8

Conozco Javascript desde hace algún tiempo, aunque no soy un gran usuario, lo sé desde el primer momento en que Netscape era mi navegador. Entiendo bastante las cosas principales, pero dado que el enfoque de JavaScript para OOP es prototípico, tengo algunos problemas para comprenderlo.

Un problema para agregar a esto parece que las cosas se pueden hacer de más de una manera, y aquí es donde los libros no ayudan mucho porque ponen todos los ejemplos en la mesa, lo que dificulta el ritmo.

Lo que necesito para comenzar es solo una forma de hacerlo, si alguien me puede ayudar con el código más simple posible, ¿un ejemplo donde puedo ver cómo funciona el modelo prototípico de OOP?

Para ser útil, el código debe tener un objeto heredado, para acceder a la propiedad de un padre y sus propiedades heredadas y la función de un padre, para sobrescribir la función de un padre y tener una instancia de una herencia múltiple donde un objeto hereda otros dos objetos.


Hola y un poco tardío Bienvenido a los programadores. Lamentablemente, esta pregunta es explícitamente 5 preguntas y una serie de otras preguntas implícitas. Esto lo hace muy desenfocado y probablemente se cerrará. Si puede enfocar su pregunta, eso podría hacerla más aceptable para las pautas del sitio. Ten un buen día.
Ingeniero mundial

@WorldEngineer Supongo que en otro idioma la mayoría de las respuestas a las 5 preguntas puntuales se pueden dar en una o pocas líneas. Lamentablemente, no puedo separar las 5 preguntas y hacerlas una por una, ¿o sí? ¿Esto está permitido?
Eduard Florinescu

1
Haga una pregunta a la vez y, si tiene más preguntas, hágalas como preguntas separadas pero vinculadas.
ChrisF

1
@WorldEngineer Edité la pregunta para que fuera solo una
Eduard Florinescu

1
Por cierto, una cosa que la herencia clásica se equivocó es separar totalmente los métodos y propiedades, en una máquina de arquitectura Neumann (ARM, PowerPC, Intel), no tiene sentido. Esto es algo que JS hace bien. Y estas fueron muy buenas preguntas para ilustrar cómo funciona proto-oop.
Aadaam

Respuestas:


6

¿Cómo se puede heredar un objeto?

function inherit(o){ // inherit is called Object.create in modern implementations
    var F= function(){};
    F.prototype=o;
    return new F();
}

var parent = {
    name: "Josh",
    print: function(){
       console.log("Hello, "+this.name);
    }
};
parent.print(); // Hello, Josh
var child = inherit(parent);
child.name = "Jeremy";
parent.print(); //Hello, Josh
child.print();  //Hello, Jeremy

¿Cómo puedo ver la propiedad de un padre?

console.log(child.__proto__.name); //won't work in IE; also see getPrototypeOf

¿Cómo puedo acceder a la función de un padre?

Object.getPrototyepeOf(child).print(); // or
child.print.apply(parent) //functions are just objects, and 'this' pointer can point to wherever you want

¿Cómo puedo sobrescribir la función de un padre?

child.print = function(){
    console.log("Hi ", this.name);
}

parent.print(); //Hello, Josh
child.print();  //Hi, Jeremy

¿Cómo un objeto puede heredar dos objetos?

//in chain?

grandchild = inherit(child);

//otherwise, there's no way.
grandchild.name = "Eddie";
grandchild.print();

Ver también:


Edité porque la función F no tenía {} y el objeto tenía; (punto y coma) en lugar de, (coma) ahora no da ningún error en la consola. Funciona y no sé por qué ahora parece tan simple. Uno de mis colegas también tiene Good Parts, pero en este caso su ejemplo ayudó más. Gracias.
Eduard Florinescu

2

El hilarante experto @venkat_s comparte una analogía para comprender la herencia prototípica.

Aquí hay una muestra de su humor: "Lo que pasa con JavaScript es que no te grita. Es tu amigo. No te dirá cuando algo está mal, simplemente dejará de funcionar. Deja de llamarte"

Por herencia, continuó: "El prototipo es como una mochila, para el objeto. Para todo en JavaScript que es un objeto, tiene una mochila y puedes poner cosas en ella. Y todos tus objetos pueden acceder a ella".

Espero que ayude.


¿Supongo que la mochila es el prototipo?
Eduard Florinescu

Sí, disculpas por la brevedad. Luego amplió la analogía a la herencia múltiple: "Es como tener una mochila y una billetera", "Simplemente pones cosas en cada uno", "Algunas veces el error con la herencia de prototipos es que ... puedes perder tu billetera y tienes que recuperarla ". Este es el desafío que puede enfrentar, pero es un patrón de diseño básico para resolver.
Jack Stone

2

Olvídate del código. La explicación más simple.

Los constructores de funciones construyen objetos. En JS, las funciones son en sí mismas objetos que pueden tener propiedades. Cada función tiene una propiedad prototipo que puede contener cualquier objeto. Puede configurar cualquier prototipo de constructor fácilmente sobre la marcha. Si quieres arruinar matrices por ejemplo,

Array.prototype = {
    oneTrueMethodToRuleThemAll: function(){
        alert('arrays are now hosed');
    }
}

El objeto prototipo es básicamente una reserva que se verifica por instancias cuando intentas hacer referencia a una propiedad que no tienen. Si el objeto prototipo no tiene ese método, el objeto prototipo de su constructor se verifica para el método. Esa es la cadena que se sigue.

Entonces no se trata realmente de herencia. Se trata de: "Oh, no tienes eso, ¿tu madre lo tiene en su bolso prototipo? ¿No? ¿Qué hay de su abuela? ¿No? Entonces, ¿qué tal ... hasta que lleguemos a Eve, o al prototipo del constructor de Objetos que es donde el dinero siempre se detiene.

Entonces, no es que sus instancias recojan o retengan las cosas en el prototipo. Es solo que cuando JavaScript llama a un método de un objeto, hay un proceso alternativo para verificar la cadena object-> constructor.prototype para ver si se puede encontrar el método desconocido. Y es por eso que cuando cambia un prototipo de constructor, todas las instancias existentes "obtienen" ese método. Realmente no obtienen nada en absoluto. Es su conjunto de objetos alternativos para la búsqueda lo que obtiene el nuevo método.

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.