¡Hola frikazos de la informática!
Este post es la segunda parte de la serie «Formas de invocar funciones en Javascript«, si no habéis leído el primero, ahí os dejo el link. Os recomiendo que le echéis un vistazo antes de continuar leyendo, ya que sino puede que os veáis un poco perdidos… o no… no se, pero leedlo que yo os esperaré, y nos sentaremos juntos frente al mar, y de la mano podremos camina-a-ar. Sigamos.
Siento que haya tardado tanto en salir la segunda parte del post, pero estas semanas hemos tenido mucho curro…
… y la verdad es que ha sido algo frustrante porque tenía tanto que daros, tantas cosas que contaros, tenía tanto codigóóóó… guardado para vosotros… (sé que código lleva acento en la primera «o»). Por lo visto, hoy me siento algo musical, pero ahora que ya he sacado algo inspiración de la Srta. Daconte, ahora sí, sigamos.
En el otro artículo nos quedamos en la invocación de funciones como funciones normales y «corrientes». El siguiente tipo de invocación que me toca explicar es la del constructor. Los que conozcáis la programación orientada a objetos ya sabéis lo que es un constructor , pero para los que no lo sepáis, un constructor es una función de una clase, que suele llevar el nombre de la misma clase en la que se encuentra, y sirve para instanciar una copia de la clase mediante la palabra clave new. En Javascript ocurre mas o menos lo mismo, pero como ya vimos en el artículo anterior, Javascript no tiene clases. Esto es un ejemplo de lo que me refiero:
var Pokemon = function(nombre) {
this.nombre = nombre;
};
Pokemon.prototype.dameTuNombre = function() {
return "Me llamo " + this.nombre;
}
var pikachu = new Pokemon('Francisco el Rechulón Amarillo');
console.log(pikachu.dameTuNombre());
// Por consola sale: "Me llamo Francisco el Rechulón Amarillo"
Como ya había mencionado en el otro artículo, Javascript tiene un tipo de herencia que se llama prototipal,
… de ahí la palabra «prototype» que vemos en el código (es us paradigma de programación similar a la programación orientada a objetos). Pues bien, si recordamos el post anterior, dije que las diferentes formas de invocar funciones en Javascript se diferencian por el valor que el lenguaje le asigna a «this». En este caso, cuando usamos la palabra clave «new» antes de llamar a la función, lo que hacemos es crear un objeto nuevo con un enlace al valor del prototipo de la función. Si debugáis código javascript, veréis que todos los objetos, incluidas las funciones, tienen un miembro llamado «__proto__», o algo así, pues bien, ese es el enlace al «padre» del objeto. Sé que es muy lioso, pero se entiende un poco mejor cuando toqueteas el código (yo personalmente hay cosas que sigo sin entender). En cuanto al valor de «this», cuando se crea este enlace, el valor de «this» cambia al objeto actual, de esta forma se puede usar como el «this» de toda la vida.
Por suerte, la última forma de invocar funciones en Javascript quizá sea la más sencilla de todas, ya que tú mismo le dices a la función el valor que debe tener «this».
En Javascript, como ya hemos visto, las funciones también pueden tener métodos, y concretamente, hay un método muy interesante con el que vienen todas las funciones, y es la función «apply». Esta función recibe dos parámetros, el valor que debe recibir «this «, y un array de parámetros. Siguiendo con el ejemplo anterior:
var Pokemon = function(nombre) {
this.nombre = nombre;
};
Pokemon.prototype.dameTuNombre = function() {
return "Me llamo " + this.nombre;
}
var pikachu = new Pokemon('Francisco el Rechulón Amarillo');
console.log(pikachu.dameTuNombre());
// Por consola sale: "Me llamo Francisco el Rechulón Amarillo"
var nombre = Pokemon.prototype.dameTuNombre.apply(pikachu);
console.log(nombre);
// Por consola sale: "Me llamo Francisco el Rechulón Amarillo"
var bulbasur = new Pokemon('Jose María el Cachondo Verde');
var nombre2 = pikachu.dameTuNombre.apply(bulbasur);
console.log(nombre2);
// Por consola sale: "Me llamo Jose María el Cachondo Verde"
Como podemos ver, no importa el objeto que uses para invocar la función, con apply puedes cambiar el valor de «this» a cualquier cosa. En este ejemplo, podría haber creado un objeto nuevo que tuviese como miembro una función llamada «nombre», que devolviese una función, que devolviese otra función, que devolviese otra función, que devolviese un nombre aleatorio, con Javascript puedes complicar las cosas todo lo que quieras.
Pues eso es todo amigos, ya he demostrado que Javascript es un lenguaje mutante parasital. Para los frikis de Starcraft, Javascript es el Zerg de los lenguajes de programación, contiene bichos dentro de otros bichos y se esparce como la espuma. Y con esta imagen mental que os he dejado, me despido.
Hasta la próxima frikazos de la informática.
Hola David, en el último console.log la salida es «Me llamo Jose María el Cachondo Verde» no?
Exacto! Menudo despiste jeje. Lo acabo de corregir :). Gracias!