El rincón de JMACOE

Como probablemente ya sabes, JavaScript puede ser difícil de depurar. Una cosa que me ha ayudado muchas veces es esta función para mostrar todas las propiedades de un objeto y sus valores. Esta función recursiva tiene propiedades que son objetos en sí mismos y muestra sus propiedades junto a sus valores. Para ver cómo funciona, pon una llamada a la función de «dumpProps (document)» en el evento «onclick» de un botón y podrás ver todo sobre el document.

Esta función proporciona un par de ventajas para la depuración. En primer lugar, te permite verificar qué objeto se está trabajando con en el script. También te permite verificar las propiedades de ese objeto (tal vez no recuerdas el nombre de la propiedad o no sabes cómo se escribe). También es bueno si está trabajando con una jerarquía de propiedades. Por ejemplo, creo que puede ser de document.body.referer la propiedad que deseas, pero si no estás seguro, puedes mostrar todas las propiedades del documento, recursivamente, hasta saber cuál es. (En realidad es document.referer).

Este código utiliza la instrucción confirmar para que no tengas que recorrer todo el camino a través de todas las propiedades una vez que encuentre la que deseas. Al hacer clic en cancelar detendrá el procesamiento. (Ten en cuenta que si haces clic en cancelar, mientras la función esta recursivamente, dejará ese nivel de recursividad y puede continuar o hacer clic en Cancelar en el nivel primario).

Aquí está la función:

function dumpProps(obj, parent) {
   // Go through all the properties of the passed-in object
   for (var i in obj) {
      // if a parent (2nd parameter) was passed in, then use that to
      // build the message. Message includes i (the object's property name)
      // then the object's property value on a new line
      if (parent) { var msg = parent + "." + i + "\n" + obj[i]; } else { var msg = i + "\n" + obj[i]; }
      // Display the message. If the user clicks "OK", then continue. If they
      // click "CANCEL" then quit this level of recursion
      if (!confirm(msg)) { return; }
      // If this property (i) is an object, then recursively process the object
      if (typeof obj[i] == "object") {
         if (parent) { dumpProps(obj[i], parent + "." + i); } else { dumpProps(obj[i], i); }
      }
   }
}

Este código debe colocarse en el sección de cabecera de su página para que pueda ser utilizado en cualquier lugar que lo necesite. Ten en cuenta que la variable «padre» es opcional y no se necesita para la llamada inicial a la función. Sólo se utiliza durante la recursividad.

Blogs similares