JavaScript 00: 3. Proto y prototype

Primera aproximación a la propiedad __proto__ y el prototipado de objetos.

waterhouse

archivado en: JavaScript / 17 junio, 2013 / taller:

Dedicaré esta tercera entrada de la serie de JavaScript orientado a objetos a hablar de «prototipos», que es una característica muy similar al concepto de herencia de cualquier lenguaje orientado a objetos, y seguiremos profundizando en qué son los objetos en este lenguaje..

Como vimos, hay varias formas de declarar un objeto en JavaScript, que sería el equivalente a una clase. La más intuitiva para quien viene de otro lenguaje orientado a objetos es asignando una función a una variable y luego declarando una instancia mediante el operador new:

var miObjeto = function() {

this.propiedad = 10;

this.metodo = function() {

console.log(this.propiedad);

}

}

miInstancia = new miObjeto;

miInstancia.metodo(); // 10

Una vez declarado un objeto, se le pueden añadir métodos y propiedades mediante la propiedad prototype:

var miObjeto = function() {

this.propiedad = 10;

this.metodo = function() {

console.log(this.propiedad);

}

}

miInstancia = new miObjeto;

miInstancia.metodo(); // 10

miObjeto.prototype.miMetodoPrototipado = function miOtroMetodo() {

console.log(this.propiedad+5);

}

miInstancia.miMetodoPrototipado(); // esto da 15

Descubriendo propiedades

Un inciso. Hay varias maneras de saber si un objeto tiene alguna propiedad. Las dos más sencillas son mediante el método hasOwnProperty, que devuelve un valor booleano...

var miObjeto = function() {

this.miPropiedad = 10;

this.miMetodo = function() {

console.log(this.propiedad);

}

}

miInstancia = new miObjeto;

console.log(miInstancia.hasOwnProperty('miPropiedad')); // true

console.log(miInstancia.hasOwnProperty('miMetodo')); // true

...Y aplicando un bucle for... in

for (var i in miInstancia) {

console.log(i); // miPropiedad; miMetodo

}

Todo es prototipable

Como vimos, en JavaScript todo es un objeto, por lo tanto también podemos añadir métodos y propiedades a los objetos globales igual que hacemos con cualquier otro objeto. Por ejemplo, este es un método prototipado al objeto Array cuya autoría ahora no recuerdo, que empleo con frecuencia para desordenar arrays.

Array.prototype.shuffle = function(){

var j, temp;

for(var i = this.length - 1; i > 0; i--){

j = Math.floor(Math.random() * (i + 1));

temp = this[i];

this[i] = this[j];

this[j] = temp;

}

return this;

}

Así, una vez añadido al objeto global Array, podemos usarlo con la notación habitual de puntos.

miArray = miArray.shuffle();

La propiedad __proto__

Lo que sigue es un lío de cuidado, pero no tenemos que preocuparnos ahora de entenderlo bien. Es solo un prólogo de la próximas entradas, donde entraremos ya de lleno en el tema.

Como ya sabemos, los objetos pueden tener propiedades, es decir, variables en las que se pueden almacenar valores de forma dinámica, y métodos, que son funciones, es decir, conjuntos de instrucciones que hacen o devuelven algo. Por ejemplo, este objeto tiene dos propiedades y un método, que devuelve la suma de sus dos propiedades:

var miObjeto = function() {

this.propiedadA = 10;

this.propiedadB = 20;

this.metodoSumar = function() {

return this.propiedadA+this.propiedadB;

}

}

miInstancia = new miObjeto;

console.log (miInstancia.metodoSumar()); // 30

Decía que en JavaScript todo son objetos o instancias de objetos, incluso los mismos objetos, que son instancias del objeto global Object (jajajaja, vaya trabalenguas).

El objeto Object tiene una serie de propiedades y métodos, como el método hasOwnProperty() que vimos antes, entre las que se encuentra la propiedad __proto__, que no funciona en versiones antiguas del Explorer (del 8 para abajo), en la cual se indica de qué objeto-padre o prototipo ha sido prototipado cada objeto-hijo. Así, por ejemplo, si declaramos un objeto siguiendo la notación de literales podemos comprobar que su prototipo es el objeto Object.

var miObjeto = { }

console.log(miObjeto.__proto__); // Object {}

Bueno, esto es mucho más complejo, pero de momento solo me interesa que comprendamos que en JavaScript todo es un objeto derivado, instanciado, prototipado de otro objeto. En la siguiente entrada profundizaremos en esta idea.

|| Tags: , ,

valoración de los lectores sobre JavaScript 00: 3. Proto y prototype

  • estrellica valoración positiva
  • estrellica valoración positiva
  • estrellica valoración positiva
  • estrellica valoración positiva
  • estrellica valoración positiva
  • 4.7 sobre 5 (7 votos)

¿Te ha parecido útil o interesante esta entrada?
dormido, valoración 1 nadapensativo, valoración 2 un poco sonrisa, valoración 3 a medias guiño, valoración 4 bastante aplauso, valoración 5 mucho

Tú opinión es muy importante, gracias por compartirla!

Los comentarios están cerrados.