Tengo que admitirlo por primera vez, y usaré esta plataforma para hacerlo. A veces, la magia que hago – lo que algunos llaman ‘programar’- no es tan perfecto como ven mis colegas cuando les presento mis magníficas creaciones. Sí, a veces uso el antiguo método de ensayo y error que llamamos ‘depurar’.
Durante esta última década, una de mis pasiones ha sido el desarrollo front (especialmente JavaScript). Como artesano, mu gusta conocer las nuevas herramientas del ramo. En este artículo, os daremos consejos para depurar como un profesional, usando nuestra querida consola.
Sí, todos conocemos los fundamentos:
console.log(‘Hola Mundo!’); //muestra un mensaje en la consola.
console.info(‘Algo sucedió…’) //igual que console.log.
console.warn(‘Algo raro sucedió…’) //igual que console.log pero muestra un aviso.
console.error(‘Algo horrible sucedió…’) //igual que console.log, per muestra un error.
Así que ahora espero poder daros unos consejos que no conocías y que te convertirán en un depurador profesional.
Consejo #1 console.trace()
Si quieres saber desde donde se ha invocado el log usa console.trace() para obtener la pila de trazas con los datos registrados.
Consejo #2 console.time() y console.timeEnd()
Si estás intentando encontrar un problema de rendimiento, empieza a contar el tiempo con console.time() e imprimir con console.timeEnd().
Consejo #3 console.memory
Si los problemas de rendimiento no desaparecen, y estas buscando una fuga de memoria, puedes utilizar console.memory (la propiedad, no la función) para comprobar la cantidad de memoria de los objetos (heap size).
Consejo #4 console.profile(‘nombreDeProfile’) y console.profileEnd(‘nombreDeProfile’)
Este no es un estándar, pero normalmente está soportado. Puedes inicializar y finalizar una herramienta de rendimiento del navegador – perfil de rendimiento – desde el código usando console.profile(‘nombre’) y después console.profileEnd(‘nombre’). Esto te ayudará a revisar EXACTAMENTE lo que quieras, y te evita depender del tiempo que tardas en hacer clic al ratón.
Consejo #5 console.count(‘ALGO QUE CONTAR’)
En caso de tener una función o código recurrente, puedes usar console.count(‘?’) para llevar la cuenta de las veces que se ha leído el código.
Consejo #6 console.assert(false, ‘Pinta en log’ )
Sí, registar en el log de forma condicional sin usar if-else 🙂
Puedes usar console.assert(condición, mensaje) para registrar un mensaje cuando la condición es falsa.
Cuidado, en Node.js esto devolverá ‘Assertion Error’.
Consejo #7 console.group(‘grupo’) y console.groupEnd(‘grupo’)
Tras escribir tantos logs, tal vez quieras organizarlos. Un pequeña herramienta para esto es console.group() y console.groupEnd(). Usando console.group, los logs de la consola se agrupan y cada agrupación crea un nuevo nivel en la jerarquía. Llamar a groupEnd reduce uno.
Consejo #8 Reemplazar cadena
Cuando logamos, podemos incorporar variables usando reemplazos de cadenas. Estas referencias deberían ser tipos %s = cadena, %i = entero, %o = objeto, %f = coma flotante/float)
Consejo #9 console.clear()
Bueno, después de escribir tantos logs, es hora de limpiar un poco la consola.
Consejo #10 console.table()
Dejando lo mejor para el final, este comando me parece muy bueno. Puedes imprimir una tabla con los objetos que estás registrando usando console.table().
Espero que estos consejos hagan tu depuración más productiva, !e incluso algo divertida!
Si te gusta la tecnoligía, únete a nosotros
Nota: puedes encontrar el artículo original en https://medium.com/appsflyer/10-tips-for-javascript-debugging-like-a-pro-with-console-7140027eb5f6