El objeto Console provee acceso a la consola de depuración de los navegadores. Los detalles de como funciona varían de navegador en navegador, pero hay un conjunto de características que de facto son generalmente proporcionadas.
console.log(console)
Escribiendo console.log(console) podemos recuperar todas los métodos disponibles en el objeto console:
assert: ƒ assert()
clear: ƒ clear()
context: ƒ context()
count: ƒ count()
countReset: ƒ countReset()
debug: ƒ debug()
dir: ƒ dir()
dirxml: ƒ dirxml()
error: (...args) => {…}
group: ƒ group()
groupCollapsed: ƒ groupCollapsed()
groupEnd: ƒ groupEnd()
info: ƒ info()
log: ƒ log()
memory: MemoryInfo {…}
profile: ƒ profile()
profileEnd: ƒ profileEnd()
table: ƒ table()
time: ƒ time()
timeEnd: ƒ timeEnd()
timeLog: ƒ timeLog()
timeStamp: ƒ timeStamp()
trace: (...args) => {…}
warn: (...args) => {…}
Assert
Con assert() el mensaje de error se muestra cuando no se cumple una condición dada.
const persona = {
nombre: "Juan",
edad: 44,
afficiones: ["programar", "leer", "comer"]
};
console.assert(persona.edad > 65, "La persona no es mayor de 65 años");
// ❌ Assertion failed: La persona no es mayor de 65 años Count
Con count se puede añadir un contador a la consola.
const persona = {
nombre: "Juan",
edad: 44,
afficiones: ["programar", "leer", "comer"]
};
persona.afficiones.forEach(
afficion => console.count("afficion")
);
// afficion: 1
// afficion: 2
Error y Alert
Los métodos error y alert permiten destacar los mensajes de consola como errores y advertencias, respectivamente.
console.error("Esto es un error");
// ❌ Esto es un error
console.warn("Esto es una advertencia");
// ⚠️ Esto es una advertencia
Group
Para evitar saturar la consola con mensajes podemos utilizar group para agrupar los mensajes. Se puede usar groupCollapsed para abrir el panel cerrado.
console.groupCollapsed('Título del grupo');
console.log('Mensaje 1');
console.log('Mensaje 2');
console.groupCollapsed('Título del grupo');
console.log('Mensaje 3');
console.log('Mensaje 4');
console.groupEnd();
Table
Con table los datos se muestran dentro de una tabla.
const persona = {
nombre: "Juan",
edad: 44,
afficiones: ["programar", "leer", "comer"]
};
console.table(persona);
Css
Además se pueden agregar estilos CSS an los mensajed de consola
console.log ("%cHola mundo", "color: red; font-size: 4rem; font-weight: bold;");