Como recorrer un objeto recursivamente con jQuery

Cuando trabajamos con javascript podemos tener que manejar objetos, por ejemplo utilizamos jQuery para hacer llamadas AJAX y mediante de la configuración del parámetro success indicamos que función se ejecutara si el llamado ha sido exitoso, en esta función recibimos varios datos del servidor, como lo indica en su documentación.

Ahora bien, si por algún motivo no conocemos cual es la estructura que tiene el parámetro data, debemos optar por revisar la variable por medio de console.log(), y de esta manera saber como esta formado dicho parámetro. Sin embargo que pasaría si nuestro objeto es demasiado grande, seria muy tedioso consultar primero los atributos existentes y luego sus valores, además si alguno de estos atributos es otro objeto seria una ardua tarea.

Para estos casos podemos pensar en crear un método recursivo que recorra el objeto y nos muestre el nombre de su atributo con su respectivo valor, entonces a su vez si el atributo es un objeto entonces que la función se vuelva a llamar para poder ver toda la estructura completa del objeto, podemos implementar el siguiente código:

<pre title="Definir jQuery.throughObject(obj)">jQuery.throughObject = function(obj){
    for(var attr in obj){
      console.log(attr + ' : ' + obj[attr]);
      if(typeof obj[attr] === 'object'){
        jQuery.throughObject(obj[attr]);
      }
    }
  }

Una vez creado nuestra función en jQuery podríamos utilizarla, como se muestra a continuación:

<pre title="Probando jQuery.throughObject(obj)">jQuery.ajax({
      url : url,
      type : 'POST',
      data: form.serialize(),
      dataType : 'json',
      async:false,
      error: function(jqXHR, textStatus, errorThrown) {
        var message = JSON.stringify(jqXHR);
        console.error(message);
        alert(message);
      },
      success : function(data, textStatus, jqXHR) {
        jQuery.throughObject(data);
      }
    });

Espero que les sea de mucha ayuda,

Saludos