Não use mais console.log ❌ da mesma maneira, mas assim... ✔
É 2022 (quase 2023), não use mais o console.log() da mesma maneira, mas assim:
- Como alguém que trabalhe com frot-end, é importante aprender usar o console.log. Esse método pode permitir que você mostre informações na tela do console ao depurar determinados problemas. 😎
-
??console.log()??
console() é um dos métodos mais usados em JS, sendo facilmente encontrado em qualquer lugar.
const nome = "rafael";
const idade = 18
console.log(nome, idade);
CONSOLE:
rafael 18
Mas quando há muita informação, fica difícil saber o que isso significa! 🤔
Então...existe alguma maneira para ver o resultado de forma clara e concisa?
Sim, só precisamos agrupar a saída em um objeto! 😁
console.log({name, age, job, hobbies});
E Voilà!
Um terminal mais limpo, objetivo e com cores! 😉
Caso queira, contribua com dicas/idéias simples aqui embaixo! :)
Uma dica https://nodejs.org/api/console.html Para ver resultados em tela sempre é bom, mas em produção é interessante não ter tanto (ou nenhum rs). Daí pra frente é interessante usar uma coisa chamada de "errors" e "warn" handlers conjunta a uma ferramenta de monitoramento (um painel para visualizar quando der problema, ou disparar um alerta).
Para brincar e fazer alguns testes, da para também colocar cores no console.
JavaScript e uma maluquisse de inconsistência, atiram tinta colorida pra tudo que e lado e juntam numa gororoba. esse e o js.
Uma maneira de visualizar JSON estruturado:
JSON.stringify({name: "tabnews"}, null, 2);
{
"name": "tabnews"
}
Ou quando querer visualizar todas as props de elemento DOM, o console.log mostra o elemento em si <div />, já o console.dir mostra toda sua estrutura em formato de objeto. Útil quando quiser saber quais props um elemento tem
console.dir(document.body);
:tada:
Não sabia essa de ordenar em um objeto, simplesmente incrível!
Excelente! Além disso, se as variáveis estiverem relacionadas a uma mesma entidade, seria bom criarmos um objeto - ao invés de inúmeras variáveis soltas.
Grande abraço \o/
Estou aprendendo JS agr aos poucos, é muito bom saber dessas coisas!
caraca muito massa, uso muito o console.log mas nunca tinha utilizado desta maneira
Cara, como que um detalhe simples desse, facilita tanto entender um codigo.
Uma outra possibilidade, caso queira estruturar um pouco melhor os dados, é, ao invés de .log, usar o .table, que exibiria esses dados em formato de tabela.
Acho mais agradável de visualizar. E quanto maior o volume de dados, melhor.