Buen dia amigos!
En esta breve nota, quiero compartir con ustedes información sobre algunos métodos del objeto Console que se pueden usar junto con console.log ().
Una lista completa de métodos se puede encontrar
aquí .
De las palabras a la acción. Sí, Chrome se usará para trabajar.
Console.debug () y console.info ()
Console.debug () y console.info () se utilizan para enviar mensajes informativos a la consola y, de hecho, son análogos de console.log (). Una de las características de console.debug () es que el mensaje que se muestra con este método solo se muestra si la consola está configurada para mostrar mensajes de nivel de depuración (para Chrome, Verbose tiene una marca de verificación en la pestaña Niveles).
Vamos a crear algunos objetos:
const harry = { name: 'Harry', age: 28, married: false, job: 'developer', salary: 300, }, alice = { name: 'Alice', age: 23, married: false, job: 'manager', salary: 100, }, bob = { name: 'Bob', age: 32, married: true, job: 'tester', salary: 200 }
Liste en la consola usando console.log (harry, alice, bob):
Ahora, usando console.debug (), proporciona información adicional ("\ n" es el carácter de control para el avance de línea, el espacio al principio es para la alineación):
console.debug( ' The first employee is', harry.name, '\n The second employee is', alice.name, '\n The third employee is', bob.name )
Obtenemos lo siguiente:
Finalmente, usando console.info (), usando comodines ("% s" es una cadena, "% d" es un número, "% s" es una directiva para aplicar estilos):
console.info(' This is %c%s%c. \n He\'s %d years old. \n He\'s %s. \n He works as %s. \n His salary is %d.', 'font-size: 1.2em; font-weight: 600; color: deepskyblue; text-decoration: underline;', harry.name, '', harry.age, harry.married ? 'married' : 'not married', harry.job, harry.salary)
Resultado (tenga en cuenta el "Harry" que envolvimos en% c):
Console.count ()
Console.count () muestra el número de llamadas al método con una etiqueta específica (pasada en el parámetro del método). Para restablecer el contador con el valor dado, use console.countReset ().
Un ejemplo ligeramente modificado con MDN:
let user = '' function greet() { console.count(user) return 'hi ' + user } user = 'bob' greet() user = 'alice' greet() greet() console.count('alice')
Vemos lo siguiente:
Personalmente, no he podido utilizar este método, pero la oportunidad me pareció interesante.
Console.group ()
Console.group () se usa para agrupar mensajes (con un desplazamiento a la derecha en un nivel). Los grupos pueden recibir nombres. Para cerrar el grupo, use console.groupEnd (). Console.groupCollapsed () hace lo mismo que console.group (), pero la salida está en un grupo minimizado (trabajamos con objetos creados anteriormente):
console.groupCollapsed('harry') console.log(harry.name) console.log(harry.age) console.log(harry.married) console.log(harry.job) console.log(harry.salary) console.groupEnd() console.groupCollapsed('alice') console.log(alice.name) console.log(alice.age) console.log(alice.married) console.log(alice.job) console.log(alice.salary) console.groupEnd() console.groupCollapsed('bob') console.log(bob.name) console.log(bob.age) console.log(bob.married) console.log(bob.job) console.log(bob.salary) console.groupEnd()
Obtenemos:
Console.table ()
Console.table () muestra los datos en una tabla.
Crea una matriz de objetos:
let staff = [{ name: 'Harry', age: 29, married: false, job: 'developer', salary: 'many', }, { name: 'Alice', age: 23, married: false, job: 'manager', salary: 'few' }, { name: 'Bob', age: 32, married: true, job: 'tester', salary: 'medium' } ]
Derívelo usando console.log (cosas):
No muy claro, de acuerdo.
Ahora usando console.table (cosas):
Todo un asunto diferente.
Console.time ()
Console.time () inicia un temporizador con el nombre del parámetro pasado. El temporizador se detiene usando console.timeEnd (). Para corregir valores intermedios, use console.timeLog ():
console.time('time')
Resultado:
Console.trace ()
Console.trace () imprime un seguimiento de pila. Se puede usar para determinar la secuencia de llamadas a funciones.
Un ejemplo ligeramente modificado con MDN:
foo() function foo() {
Resultado:
Nunca se usó, pero tomó notas.
Eso es todo para mí. Todo lo mejor