Vamos a introducirnos en un tema muy importante de Javascript como son los objetos. Es un tema que aun no hemos visto y sobre el que en adelante vamos a tratar constantemente pues la mayoría de las cosas en Javascript, incluso las más sencillas, las vamos a realizar a través del manejo de objetos. De hecho, en los ejemplos realizados hasta ahora hemos hecho grandes esfuerzos para no utilizar objetos y aun así los hemos utilizado en alguna ocasión, pues es muy difícil encontrar ejemplos en Javascript que, aunque sean simples, no hagan uso de ellos.

La programación orientada a objetos (POO) representa una nueva manera de pensar a la hora de hacer un programa. Javascript no es un lenguaje de programación orientado a objetos puro porque, aunque utiliza objetos en muchas ocasiones, no necesitamos programar todos nuestros programas en base a ellos. De hecho, lo que vamos a hacer generalmente con Javascript es usar objetos y no tanto programar orientado a objetos. Por ello, la manera de programar no va a cambiar mucho con respecto a lo que hemos visto hasta ahora en el Manual de Javascript. En resumen, lo que hemos visto hasta aquí relativo a sintaxis, funciones, etc. sigue siendo perfectamente válido y puede ser utilizado igual que se ha indicado. Solo vamos a aprender una especie de estructura nueva como son los objetos.

Qué es un objeto

Aunque no vamos a entrar en detalle con los concetos, pues se encuentran muy bien explicados en referencias que ya hemos indicado, los objetos son una herramienta de lenguajes de programación en la que se unen dos cosas fundamentales: los datos y la funcionalidad. Todo programa informático trata básicamente esas dos cosas de alguna manera. Con lo que hemos visto hasta ahora los datos los teníamos en variables y la funcionalidad en funciones ¿no es así? pues en el mundo de los objetos, tanto datos como funcionalidad están en la misma estructura, el objeto.

El asunto es que ahora necesitas aprender nuevos nombres con los que referirte a los datos y funcionalidad agrupados en un objeto:

• Propiedades: En los objetos las propiedades se refieren a los datos
• Métodos: En objetos, los métodos se refieren a la funcionalidad

Imagina que tienes un objeto botón (un botón del navegador, algo que puedes pulsar para realizar una acción). El botón tiene un texto escrito, pues ese texto sería un dato y por lo tanto le llamaríamos propiedad. Otra propiedad de un botón sería si está o no activado. Por otra parte, un botón podría tener funcionalidad asociada, que estaría en un método, como procesar la acción de un clic. Imagina algo más genérico como un teléfono. El teléfono puede tener propiedades como la marca, modelo, sistema operativo y métodos como encender, apagar, llamar a un número, etc.

En lenguajes de programación orientados a objetos puros, como puede ser Java, tienes que programar siempre en base a objetos. Para programar tendrías que crear "clases", que son una especie de "moldes" a partir de los cuales se crean objetos. El programa resolvería cualquier necesidad mediante la creación de objetos en base a esos moldes (clases), existiendo varios (decenas, cientos o miles) de objetos de diversas clases. Los objetos tendrían que colaborar entre si para resolver cualquier tipo de acción, igual que en sistemas como un avión existen diversos objetos (el motor, hélices, mandos...) que colaboran entre sí para resolver la necesidad de llevar pasajeros o mercancía en viajes aéreos.

Sin embargo, como veníamos diciendo, en Javascript no es tanto programar orientado a objetos, sino usar objetos. Muchas veces serán objetos ya creados por el propio navegador (la ventana del navegador, un documento HTML que se está visualizando, una imagen o un formulario dentro de ese documento HTML, etc), y otras veces serán objetos creados por ti mismo o por otros desarrolladores que te sirven para hacer cosas específicas. Por tanto, lo que nos interesa saber para comenzar es la sintaxis que necesitas para usar los objetos, básicamente acceder a sus propiedades y ejecutar sus métodos.

Cómo acceder a propiedades y métodos de los objetos

En Javascript podemos acceder a las propiedades y métodos de objetos de forma similar a como se hace en otros lenguajes de programación, con el operador punto (".").

Las propiedades se acceden colocando el nombre del objeto seguido de un punto y el nombre de la propiedad que se desea acceder. De esta manera:

miObjeto.miPropiedad

Para llamar a los métodos utilizamos una sintaxis similar, pero poniendo al final entre paréntesis los parámetros que pasamos a los métodos. Del siguiente modo:

miObjeto.miMetodo(parametro1,parametro2)

Si el método no recibe parámetros colocamos los paréntesis también, pero sin nada dentro.

miObjeto.miMetodo()

Cómo crear objetos

Como hemos dicho, la mayoría de los objetos con los que vas a trabajar en Javascript para poder crear interacción, efectos y comportamientos diversos en páginas web, te los dan ya hechos. El propio navegador te los ofrece para que tú simplemente los tengas que usar. Eso es material de estudio del Manual de Javascript y los objetos del navegador. Aclarado ese punto hay que advertir que Javascript es un tanto particular a la hora de crear objetos, básicamente porque tradicionalmente no existe el conceto de "clase".

Para ser más exactos, en Javascript, ES5, las clases se crean por medio de funciones y con el operador new creas objetos a partir de esas funciones, pero no existen las clases como las que conocemos en otros lenguajes más tradicionales.

La otra alternativa para crear objetos en Javascript es por medio de literales de objeto, que no son más que la definición del objeto por medio de código encerrado entre llaves, indicando sus propiedades o métodos tal cual.

{
   nombre: 'Miguel Angel Alvarez',
   sitioWeb: 'DesarrolloWeb.com'
}

En el código anterior solo hemos definido propiedades, pero tenemos otros artículos donde podrás ver cómo definir métodos también. Para saber más sobre los literales de objetos te recomendamos la lectura del artículo sobre Literales de objetos Javascript, donde vamos a explicarte más detenidamente esta sintaxis habitual de creación de objetos en este lenguaje.

En Javascript tradicional hemos dicho que no existen las clases, pero podremos crear instancias de objetos a partir de funciones, como veremos en el siguiente punto.

Crear e instanciar objetos a partir de funciones

Para quien no lo sepa, instanciar un objeto es la acción de crear un ejemplar de una clase, para poder trabajar con él luego. La clase es la definición de las características y funcionalidades de un objeto. Con las clases no se trabaja directamente, éstas sólo son definiciones. Para trabajar con una clase debemos tener un objeto instanciado de esa clase. Recordamos que en Javascript no existen clases, pero podemos usar funciones.

Esta simple función podríamos usarla como molde para construir objetos de la clase Persona:

function Persona(nombre) {
  this.nombre = nombre;
}

Observarás que estamos usando dentro la palabra "this". Esa palabra es una referencia al objeto que se va a crear con esta función. En javascript para crear un objeto a partir de una función se utiliza la instrucción new, de esta manera.

var miguel = new Persona('Miguel Angel Alvarez');

En una variable que llamamos "miguel" asigno un nuevo (new) ejemplar de la clase Persona. Los paréntesis se rellenan con los datos que necesite la clase para inicializar el objeto, si no hay que meter ningún parámetro los paréntesis se colocan vacíos. En realidad lo que se hace cuando se crea un objeto es llamar a la función que lo construye y la propia función se encargará de inicializar las propiedades del objeto (para lo que usa la referencia "this").

Ciertamente, si los conceptos de programación orientada a objetos son nuevos para ti, quizás muchos puntos de este artículo se quedarán un poco complejos. No queremos que te asustes, puesto que volveremos sobre todo esto en futuros artículos y lo podrás ir entendiendo mejor. En concreto, esta parte de la creación de objetos a partir de funciones está explicada en el artículo Creación de clases en Javascript con ES5. Recuerda también aclarar tus dudas más teóricas sobre clases y objetos en el Manual de la teoria de la programación orientada a objetos.