5.- Programación Orientada a Objetos (POO) – Curso Básico De #Javascript #5

La programación orientada a objetos, es el paradigma hoy en día mas utilizado en los lenguajes de programación, esto debido a su facilidad de organizar las cosas, y dividir la funcionalidad. Para aquellos que no han escuchado este término, se los explico brevemente (ya que lo explico en un breve curso: curso de Programación Orientada a Objetos en 1o minutos), la programación orientada a objetos (POO) nace por la necesidad de representar el mundo en el que habitamos (junto a sus problemas) por medio de objetos como nosotros los percibimos, con sus atributos y funcionalidades, por ejemplo un objeto auto, sabemos por sentido común que tiene llantas, tiene volante, tiene ventanas, puertas, a esto le llamamos atributos (variables), los cuales pueden variar de un auto a otro, pero la mayoría de autos deben tener todo esto para ser autos, de igual manera sabemos que un auto camina y frena, y a esto le llamamos funcionalidad la cual se representa por métodos (funciones). Este es un concepto breve y que servirá para el propósito que tenemos en este capítulo, el cual es representar objetos del mundo físico en javascript por medio de la POO(Programación Orientada a Objetos).

Para crear un objeto en javascript necesitamos de lo que en POO, llamamos clase; una clase es el molde para crear el objeto; la clase define que atributos debe tener el objeto  y cuál es su funcionalidad y para ello vamos a ver un ejemplo de cómo representaríamos un Libro en javascript  utilizando la POO, y la clase Libro se hace de la siguiente manera:

//clase Libro
function Libro(nombre,autor){
this.nombre=nombre;
this.autor=autor;
}

Podemos observar que su sintaxis es la misma que la de una función, excepto que dentro tenemos algo nuevo para nosotros, la palabra this, esto indica que dentro de esta función existen dos atributos, los cuales adquieren su valor por los parámetros enviados al invocar la función, estos atributos pueden ser utilizados posteriormente por nuestro objeto creado, pero para facilitar las cosas vamos a un ejemplo de cómo utilizar la clase creada anteriormente, y como acceder a sus datos:

//Objeto LibroTerror creado con la clase Libro
var LibroTerror= new Libro("En las montañas de la locura","Lovecraft");
alert(LibroTerror.nombre);
//esto mostraría en un alert  nombre "En las montañas de la locura"

De esta manera queda claro cómo podemos crear estructuras para plasmar el mundo físico en javascript, pero que pasa con la funcionalidad, también nuestros objetos tienen funcionalidad, para ello vamos a crear una clase biblioteca, a la cual se le agregan libros, y para nuestra ventaja, con un método también podríamos saber que libros hay en la biblioteca(sin estar viendo en todos los libreros de esta, ¡bendita programación!), para ello veamos el siguiente ejemplo:

//clase Biblioteca
function Biblioteca(nombre){
this.nombre=nombre
//atributo arreglo para guardar los libros
this.Libros= new Array();
//metodo que agrega libros a nuestra biblioteca
this.addLibro=function addLibro(libro){
this.Libros.push(libro)
}

//método que muestra todos los libros utilizando un foreach en el arreglo Libros de esta clase
this.muestraTodosLosLibros=function muestraTodosLosLibros(){
var cadenaLibros="";
this.Libros.forEach(function(libro){
cadenaLibros+=libro.nombre+"n";
})
//regresamos los nombres de los libros concatenados
return cadenaLibros;
}
}

Ahora vemos que dentro de una función (que utilizamos como clase), existen otras funciones, estas funciones pueden ser llamadas por el objeto, también en una clase de javascript podemos tener arreglos, y a estos agregarle objetos los cuales nosotros creamos con anterioridad, y si somos cuidadosos, podemos observar que el método muestraTodosLosLibros() utiliza el forEach del capítulo anterior.

Pasemos a la parte divertida, ver como se utiliza la clase Biblioteca, para ello, pondré el código completo, el cual contiene comentarios parte por parte, pueden copiar y pegar en un archivo de texto con extensión html y abrirlo en un navegador, el código es el siguiente:


//clase Libro
function Libro(nombre,autor){
this.nombre=nombre;
this.autor=autor;
}

//clase Biblioteca
function Biblioteca(nombre){
this.nombre=nombre
//atributo arreglo para guardar los libros
this.Libros= new Array();
//metodo que agrega libros a nuestra biblioteca
this.addLibro=function addLibro(libro){
this.Libros.push(libro)
}

//metodo que muestra todos los libros utilizando un foreach en el arreglo Libros de esta clase
this.muestraTodosLosLibros=function muestraTodosLosLibros(){
var cadenaLibros="";
this.Libros.forEach(function(libro){
cadenaLibros+=libro.nombre+"n";
})
//regresamos los nombres de los libros concatenados
return cadenaLibros;
}
}

//creamos libros para nuestra biblioteca
var LibroTerror1= new Libro("En las montañas de la locura","Lovecraft");
var LibroTerror2= new Libro("Llamada del Cthulhu","Lovecraft");
var LibroNegro1= new Libro("El Psicoanalista","John Katzenbach");

//creamos un objeto de tipo Biblioteca
var BibliotecaPublica = new Biblioteca("Biblioteca Publica");

//Agregamos los libros a la biblioteca por medio del metodo addLibro()
BibliotecaPublica.addLibro(LibroTerror1);
BibliotecaPublica.addLibro(LibroTerror2)
BibliotecaPublica.addLibro(LibroNegro1)

//invocamos el metodo muestraTodosLosLibros del objeto Biblioteca
alert(BibliotecaPublica.muestraTodosLosLibros())

Para ver este código en acción den clic aquí.

En este capítulo vimos como crear clases para ser moldes de objetos, también vimos como dentro de nuestras clases podemos agregar atributos simples y complejos (arreglos), otra cosa que resalta es el poder poner funcionalidades a nuestros objetos, y de esta manera organizar nuestro código, de una manera elegante y formal.

Ir Capítulo Siguiente (6.- Eventos)

Ir Capítulo Anterior (4.- Arreglos)

mm

About

Desarrollador de software, lector compulsivo.

View all posts by