63

Vejo isso em alguns arquivos JavaScript:

console.log(algumaCoisa);
console.log("alguma coisa");

Para que serve e como funciona?

Estou tentando fazer um log() personalizado para um Userscript (vide How can I log information without using alert in userscripts) e me dei conta que não conheço o que está por trás do console.log.

2
  • uma maneira de depurar seu codigo. Esse comando irá mostrar no console de seu navegador o que estiver escrito na função log.
    – leonardo
    Commented 24/10/2014 às 17:24
  • Some tips: You can use colors to have a better view of: console.log('%c Sample Text', 'color:green;'); Or add some VAR in the text using: console.log(`Sample ${variable}`, 'color:green;'); When you have some OBJECTS, you can show using table: w3schools.com/jsref/met_console_table.asp Commented 29/01/2019 às 11:52

4 Respostas 4

55

Objeto Console

O console é efetivamente um objeto com diversos métodos associados.

O objeto console fornece acesso à consola de depuração do navegador. O funcionamento deste objeto varia de navegador para navegador mas existem determinados métodos que são vistos como um standard. Um desses métodos é o log().

Método log

O método log() existe essencialmente para permitir o envio de dados para a consola de depuração do navegador. Pode ser enviada qualquer informação, normalmente com o intuito de depurar código.

Exemplo da consola do Firefox:
inserir a descrição da imagem aqui Primir ctrl + shift + k para chamar a mesma no Firefox.

Considerações

Como este objeto varia e não existe ainda um standard a reger o funcionamento e metodologia do mesmo, existem algumas considerações a ter:

// Exemplo a enviar algo para a consola do navegador
var s = "bubu";
console.log(s);

Potenciais problemas:

  • O utilizador pode ter desligado a consola;
  • O navegador pode não ter consola Web;
  • O método que estamos a utilizar pode não funcionar em determinado navegador.

Em JavaScript, uma falha de execução pode resultar num bloqueio de todo o restante JavaScript. Se por exemplo fizermos uso do console.log(X) quando a consola não existe ou o método log() não existe, vamos ter um erro no nosso código.

Alternativa:

Podemos fazer uso de um try...catch para tentar enviar para a consola e em caso de falha agir de outra forma:

function consola(s) {
    try { console.log(s); } catch (e) { alert(s); }
}

E assim se correr bem, a informação estará na consola, se correr mal vai ser emitido um alert() com a informação que iria para a consola.

Claro que podemos não fazer nada ou enviar uma chamada de Ajax para um servidor com o erro se o mesmo for critico e tiver que ser registado "doa a quem doer".

/* Enviar algo para a consola do navegador com fallback 
 * fazendo uso da função já declarada conforme visto em cima
 */
var s = "bubu";
consola(s);

Consolas

Como explicado, não existe propriamente um standard para a consola web, pelo que ficam algumas referências às páginas de ajuda de cada um:


Nota: Resposta a evoluir dentro de alguns dias logo que termine de compilar mais informação relevante sobre este assunto.

1
  • 8
    Yes! StackExchange.resposta.carimbar('Canônica')
    – brasofilo
    Commented 24/10/2014 às 19:00
51

Isso escreve uma mensagem qualquer no LOG do browser, que pode ser visualizada a qualquer momento.

Essas mensagens podem ser usadas com vários propósitos:

  • auxiliar na programação (tipo quando você dá um alert só para ver se um método foi chamado... funciona da mesma forma, mas sem interromper o fluxo)
  • instruções de uso de uma biblioteca... imagine que uma função se tornou obsoleta, e você quer que as pessoas parem de usar a função, mas sem lançar uma exceção... se bem que neste caso, outras funções podem ser usadas: console.warn seria mais recomendável.

Outros métodos de LOG existentes:

  • console.info
  • console.warn
  • console.error
  • console.debug

Todas elas servem para escrever mensagens, a diferença, entre os métodos está justamente no significado da mensagem. Veja como ficam as mensagens com cada um desses métodos:

inserir a descrição da imagem aqui

    (exemplo: janela de console do chrome)

2
  • 3
    +1 por mostrar os outros métodos do objeto console
    – igrossiter
    Commented 29/10/2014 às 18:42
  • 1
    Eu não sabia dos outros métodos além do 'log'. Excelente resposta! +1 Commented 31/10/2014 às 22:34
26

console.log é um método entre vários outros disponíveis para o console de debug dos navegadores.

Lista de outros métodos do console.

console.log é utilizado para a emissão de informações de registro em geral. Por exemplo:

var algumObjeto = {
  str: "Algum texto",
  id: 5
};
console.log(algumObjeto);

Saída:

({str:"Algum texto", id:5})

var algumObjeto = {
  str: "Algum texto",
  id: 5
};
console.log(algumObjeto);
Observar a saída no console do navegador!

Você também pode utilizar substituição de string e outros argumentos com este método. Por exemplo:

for (var i=0; i<5; i++) {
  console.log("Olá, %s. Você me chamou pela %dª vez.", "João", i+1);
}

Saída:

Olá, João. Você me chamou pela 1ª vez.
Olá, João. Você me chamou pela 2ª vez.
Olá, João. Você me chamou pela 3ª vez.
Olá, João. Você me chamou pela 4ª vez.
Olá, João. Você me chamou pela 5ª vez.

for (var i = 0; i < 5; i++) {
  console.log("Olá, %s. Você me chamou pela %dª vez.", "João", i + 1);
}
<p>Observar a saída no console do navegador!</p>

Limitações e falte de suporte

Esse recurso pode não estar disponível ou ativo no browser, então sempre deve-se testar sua existência antes de tentar utiliza-lo:

// verifica se o objeto window.console existe
if (window.console){
    window.console.log("Log isto");
}

Observações importantes

Além das situações citadas anteriormente, versões antiga do IE, ou < IE9, não apresentam este método da forma apresentada anteriormente (com o mesmo nome/assinatura) ou não apresentam, como citado nessas referencias:

Fonte: MDN Console

-4

O console.log é uma função em JavaScript utilizada para imprimir mensagens no console do navegador ou do ambiente de desenvolvimento. É uma ferramenta útil para desenvolvedores depurarem o código e verificarem o valor de variáveis ou o estado do programa em diferentes pontos da execução. Aqui está um exemplo básico de uso do console.log:

let mensagem = "Olá, mundo!"; console.log(mensagem); // Isso imprimirá "Olá, mundo!" no console.

No exemplo acima, a mensagem "Olá, mundo!" será exibida no console do navegador ou da ferramenta de desenvolvimento onde o código estiver sendo executado.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .