Como definir parámetros predeterminados en funciones con jQuery

En muchos lenguajes de programación podemos definir valores predeterminados para los parámetros de una función o un método, sin embargo en javascript esta característica no esta permite, entonces no podemos definir valores predeterminados para los parámetros.

Sin embargo esto no significa que no podamos suplir esta necesidad con métodos alternos, la librería de jQuery trae incluida la función jQuery.extend() la cual nos permite hacer una combinación entre dos o más objetos, justamente esta función nos permitirá generar una manera para definir valores predeterminado a nuestras funciones en javascript.

1. Crear función de ejemplo.

Para estos efectos crearemos una función en jQuery que imprimirá los valores que recibe por parámetro, la función se vera de la siguiente manera:

<pre title="jQuery.printParameters">jQuery.printParameters = function(image, content){
  console.log(image);
  console.log(content);
}

2. Re-implementar función utilizando Object Notation.

En la función anterior únicamente recibimos unos parámetros y los imprimimos en consola, antes de continuar implementaremos esta misma función pero utilizando JavaScript Object Notation para manejar la función y utilizar solamente un objeto como parámetro, esto nos facilitara el trabajo de poder definir parámetros por defecto, ahora la función quedara así:

<pre title="jQuery.printParameters usando JSON">jQuery.printParameters = function(values){
  console.log(values.image);
  console.log(values.content);
}

Ahora bien, pudiéramos probar nuestra función para ver como se comporta, según muestra la siguiente imagen:

Bueno a todo esto, como se vería si no enviamos los atributos a nuestro objeto JSON, la salida seria la siguiente:

Entonces, en este último caso es cuando deseamos imprimir un valor predeterminado si no viene definido en el parámetro.

Podríamos utilizar el operador typeof que tiene javascript para verificar si existen o no el parámetro, sin embargo esto generaría un mucho código extra en nuestra función. Sin embargo veamos como seria la implementación.

<pre title="jQuery.printParameters con operador typeof">jQuery.printParameters = function(values){
  
 values.image = (typeof values.image !== 'undefined' && typeof values.image !== null)? values.image : '/sites/default/files/default_image.png'; 

  values.content = (typeof values.content !== 'undefined' && typeof values.content !== null)? values.content : 'In blandit, odio convallis suscipit venenatis, ante ipsum cursus augue.'; 

  console.log(values.image);
  console.log(values.content);
}

De esta manera pudiéramos verificar y asignar un valor predeterminado a nuestro parámetro, sin embargo si nuestro objeto JSON crece exponencialmente seria ardua tarea estar dándole mantenimiento para agregar una nueva definición de un valor por defecto.

3. Implementar valores por defecto usando jQuery.extend().

En el siguiente código podemos observar como se soluciona la necesidad de parámetros predeterminados utilizando jQuery.extend.

<pre title="jQuery.printParameters con jQuery.extend">jQuery.printParameters = function(values){
  
  values = jQuery.extend({
      'image': '/sites/default/files/default_image.png',
      'content': 'In blandit, odio convallis suscipit venenatis, ante ipsum cursus augue.'
    }, values);

  console.log(values.image);
  console.log(values.content);
}

En términos simples el jQuery.extend() realizar un mezcla de objetos en donde el primer parámetros en el objeto resultante y los siguientes parámetros se mezclan en el objeto resultante. De estar forma si el parámetro esta vació tendremos nuestros valores por defecto, pero si tiene valores los valores por defecto serán sobre escritos.

Entonces, si probamos la salida lo veremos de la siguiente manera.

Esta forma de utilizar jQuery.extend la podemos ver mucho en los miles de plugin que existen para tareas diversas en jQuery, entonces podemos estar seguros en utilizarla,

Espero que esto les haya sido de gran ayuda, solo queda mencionar que esto no significa que sea una regla magna para definir valores por defecto en las función javascript, esto es solo una solución alterna y ustedes pueden sentirse en la libertad de crear sus propios métodos alternos,

Saludos,