Programación orientada a objetos con JavaScript

  • 17 Nov 2008
  • JavaScript

Por qué es tan bueno trabajar con Objetos?

Se trabaja tan bien con objetos, porque actuan como objetos de la vida real. Los objetos tienen propiedades y metodos. Entonces.. si estamos hablando de una lámpara, una propiedad podrían ser su ancho y largo. Un método podría ser el brillo. Y cuando brilla, su propiedad de iluminación seria un valor mas alto que cuando está apagada (fruta1). Creating objects using new Object() En javascript hay un montón de maneras de crear objetos y todos tienen su lugar. La manera más fácil, es usando el operador "new", especificamente.. new Object(). Se definió un objeto personalizado "person" y se le agregaron sus propiedades y métodos. En este caso, el método personalizado simplemente inicializa dos propiedades más. Creating objects using Literal Notation Otra forma de definir un objeto es a través de la notación literal. Apoyado en JavaScript1.2 y superiores, es una forma más sólida de crear un objeto sobre la marcha: Utilizando notación literal, pueden contenerse arrays JavaScript o expresiones arbitrarias o valores.

Object Constructor and prototyping

En el mundo de OOP, las formas vistas para crear un objeto son muy limitadas en muchas situaciones. Necesitamos la manera de crear un objeto "type" que pueda ser utilizado cuantas veces sea necesario, sin la necesidad de tener que redefinirlo. El estándar para alcanzar este objetivo es utilizar la finción "Object Constructor". Un "Constructor Object" es simplemente una función de JavaScript regular, por lo que es igual de sólida (es decir, definir parámetros, llamar a otras funciones, etc.) La diferencia entre los dos es que un constructor es llamada a través del nuevo operador (que veremos a continuación). Al basar nuestra definición de objetos en función de la sintaxis, tendremos su misma robustez. Usaremos el elemento del mundo real "cat" como ejemplo. Una propiedad de un gato podrían ser su color o nombre. Un método podría ser.. "meeyow". Lo importante a notar es que cada gato tendrá un nombre diferente.. o un maullido diferente. Para crear un tipo de objeto que se adapte a esta necesidad de flexibilidad, usaremos un objeto constructor: Aquí, la función "cat()" es un object constructor y sus propiedades y métodos se declaran dentro de ella utilizando el prefijo "this." Los objetos definidos con un object constructor son luego llamados usando el mismo prefijo. Notesé como podemos facilmente definir multiples casos (instances) del gato, cada una con su nombre, esta es la flexibilidad que el object constructor brinda a un objeto personalizado. Los constructores crean los planos para los objetos, no al objeto en sí.

Agregando métodos a nuestro objeto usando prototype

Hemos visto anteriormente cómo agregar un método a nuestra función constructor simplemente declarandoló dentro de la función. Otro enfoque es a través de prototype, que también es más popular debido a su elegancia. Prototype es un tipo de herencia en JavaScript. Lo usamos cuando queremos que un objeto herede un método después de que se ha definido. Pensá en prototype como "vincular" un método a un objeto después de que ha sido definido, en el que todas las instancias del objeto son instantáneamente compartidas. Extenderemos el objeto cat() con un método adicional para cambiar el nombre del gato, usando prototype: Como se puede ver, simplemente se utilizó la palabra clave "prototype", inmediatamente después del nombre del objeto que utilizará esta funcionalidad. El método personalizado changeName() es ahora compartida por todas las instancias del gatienso.

Using prototype on prebuilt JavaScript objects

Prototype trabaja tanto en objetos personalizados como en objetos preestablecidos, como Date() o String. Para la posteridad... la regla general es que es posible prototypear cualquier objeto armado que empieza con la clave "new". El que sigue, es un ejemplo "of the later", que agrega una función adicional al objeto Array de JavaScript. IE5 no soporta los métodos shift() y unshift() para Array.. NS4+ sí, asi que.. a prototypear canejo! Las posibilidades no son infinitas.. ya que se necesitaría demasiada gente o tiempo para concretarlas

Subclasses and Superclasses

El Java y C++ existe un concepto explícito de la clase jerarquía. Toda clase puede tener una superClase de la cual hereda propiedades y métodos. Cualquier clase puede ser extendida, o "sub claseada" para que la clase resultante pueda heredar el comportamiento de su Clase pariente. Como vimos, JavaScript soporta herencia con prototype en vez de la basada en clase. Sin embargo, es posible pasar la herecia por otras vías. El siguiente ejemplo, muestra como heredar a través de funciones. En la mayoría de los casos, la herencia a través de prototype es algo mejor para aplicaciones JavaScript.

Objects as Associative Arrays

Como podrás saber, el punto (.) puede usarse para acceder al operador [] usado con Arrays. The important thing to notice is that in the object syntax the property is an identifier, whereas in the array syntax, it's a string. The obvious benefits of using an array syntax to access an object is because of the literal data type, you can easily concat strings and play around with them to access an object. For this to work with the standard syntax, an eval() would need to be used.

How do I loop through properties in an object?

You need to use a for/in loop. http://www.javascriptkit.com/javatutors/oopjs2.shtml