Qué son las funciones en JavaScript

La Reflexión en JavaScript. ¿Qué es y para qué se usa?
La Reflexión en JavaScript. ¿Qué es y para qué se usa?
25 de abril de 2023
Cómo aumentar tipos en JavaScript
Cómo aumentar tipos en JavaScript
9 de mayo de 2023
La Reflexión en JavaScript. ¿Qué es y para qué se usa?
La Reflexión en JavaScript. ¿Qué es y para qué se usa?
25 de abril de 2023
Cómo aumentar tipos en JavaScript
Cómo aumentar tipos en JavaScript
9 de mayo de 2023

En esta ocasión, vamos a ver qué son las funciones en JavaScript y algunas de sus propiedades. Podemos decir que una de las cosas que mejor implementa JavaScript son las funciones.

Qué son las funciones

Una función es la unidad modular fundamental de JavaScript con la que podemos dotar de comportamiento a nuestros objetos, y está implementada como un objeto. Una función en JavaScript es un objeto.

Partes de una función

Una función tiene (o puede tener) cuatro partes:

  • La primera parte es la palabra reservada function con la que espedificamos que estamos definiendo una función
  • La segunda parte, opcional, es un nombre. Una función en JavaScript puede o no tener un nombre. Si no lo tiene se le asignara el nombre anonymous en tiempo de ejecución
  • La tercera parte es el conjunto de parámetros que pasamos entre paréntesis. Puede o no tener. Además, dentro del ámbito de nuestra función, tendremos acceso a una propiedad llamada arguments, donde están todos los parámetros que se pasan a la función al ser invocada (que pueden coincidir o no en número con los parámetros definidos en la función. Lo veremos al final del artículo)
  • La cuarta, son las instrucciones, el código propio de nuestra función que va entre llaves.

Veamos un par de ejemplos:

// Ejemplo de función con nombre
function suma(a,b) {
     return a+b;
}

// Ejemplo de función sin nombre
var suma = function (a,b) {
     return a+b;
}

La invocación de una función

La invocación es una de las propiedades de las funciones. A traves de la invocación, se suspende el flujo normal de nuestro código, pasando el control a la función para ejecutarse. Una vez terminada la ejecución de nuestro programa, el control se devuelve al punto inicial cuando se invocó nuestra función.

Patrones de invocación

En JavaScript, tenemos 4 patrones de invocación a funciones: patrón de invocación de método, patrón de invocación de función, patrón de invocación de constructor y el patrón de invocación de aplicación.

The Method Invocation Pattern

Cuando una función es creada como una propiedad de un objeto, la llamaremos método. Cuando el método es invocado se tiene en el contexto de éste a «this». Veamos un ejemplo:

var miObjeto = {
     valor: 0,
     incrementar: function (incremento) {
          this.value += incremento;
     }
}
// Invocación
miObjeto.incremento(1); //=> 1
miObjeto.incremento(2); //=> 3

The Function Invocation Pattern

Cuando una función no es una propiedad de un objeto, entonces es invocada como función. Lo que es una función «de toda la vida». En este caso, el objeto «this» del contexto de la función, es referente al contexto global, no al objeto o función desde donde se hizo la llamada. Veamos un ejemplo:

// Declaramos la función
function suma(a,b) {
     return a+b;
}
// Invocamos la función
console.log(suma(1,2)); //=> 3

The Constructor Invocation Pattern

A través del prototype, podemos crear funciones que son llamadas cuando instanciamos el objeto con el prefijo new. Entonces, todas las funciones que son invocadas cuando instanciamos un objeto de esta forma, se están invocando con el patrón de invocación de constructor. Veamos un ejemplo. Partimos del objeto objeto coche:

var Coche = function (marca) {
     this.marca = marca;
}

Creamos ahora un método en el prototype:

coche.prototype.get_marca = function() {
     return this.marca;
}

Creamos ahora un objeto de tipo coche e invocamos la función a través del patrón de constructor:

// Creación del objeto
var miCoche = new Coche("Audi");
// Llamamos a la función get_marca con el patrón constructor
miCoche.get_marca() //=> "Audi"

The Apply Invocation Pattern

En JavaScript, podemos aplicar a un objeto, métodos de otro objeto. Esto se conoce como el patrón de invocación de aplicación. Lo vamos a entender de forma muy sencilla con un ejemplo. Partimos del objeto Coche y su método get_marca que creamos en el prototype. Ahora cremos el siguiente objeto:

var ordenador = {
     marca: "Mac"
}

Tiene una propiedad con el mismo nombre que el objeto Coche, la misma que devuelve el método get_marca. Pues podemos usar el método get_marca del prototype de Coche para obtener la marca del objeto ordenador de la siguiente forma:

Coche.prototype.get_marca.apply(ordenador) //=> "Mac"

Fíjate que estamos accediendo a Coche con la C mayúscula, no a la instancia miCoche que creamos.

El parámetro arguments de una función

Además de los parámetros con los que definimos una función, todas las funciones tienen un parámetro adicional oculto llamado «arguments» al que podemos acceder dentro de la propia función. Veamos un ejemplo:

var imprimir = function() {
     for (i=0; i < arguments.length; i++) {
          console.log(arguments[i]);
     }
}

Como podemos ver, esta función no recibe ningún parámetro, pero tenemos disponible el parámetro oculto arguments. Esto nos permite que podamos hacer una función cuyo número de parámetros al llamarla sea variable. Veamos un ejemplo de uso:

imprimir("Hola", "Me llamo Antonio,"Como estás?");
// Salida obtenida
//=> "hola"
//=> "ME llamo Antonio"
//=> "Cómo estas?"

El Return de una función

Cuando una función es invocada, se pausa el flujo actual de ejecución y se pasa el control a la función. Este flujo de ejecución se puede romper utilizando un return o sencillamente se devuelve el control de ejecución cuando termina de ejecutarse la función.

Tenga o no un return, una función siempre devuelve un valor. Si lo tiene, devolverá lo que se especifique en el return, y si no lo tiene, la función devolverá undefined.

Ya sabes qué son las funciones en JavaScript y algunas de sus propiedades. Puedes aprender más en nuestra sección de Desarrollo Web o en la sección específica de JavaScript.

¡Espero que te haya sido de utilidad!

Antonio J. Galisteo
Antonio J. Galisteo
Soy Antonio J. Galisteo. Ingeniero de software con amplia experiencia en desarrollo frontend, backend, aplicaciones móviles y de escritorio.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Qué son las funciones en JavaScript
Este sitio web usa cookies para mejorar tu experiencia. Al navegar por este sitio aceptas nuestra Política de Protección de Datos.
Leer más