Como posso fazer o console.log mostrar o estado atual de um objeto?

No Safari sem complementos (e na maioria dos outros navegadores), console.logo objeto será mostrado no último estado de execução, não no estado em que console.logfoi chamado.

Eu tenho que clonar o objeto apenas para produzi-lo via console.logpara obter o estado do objeto nessa linha.

Exemplo:

var test = {a: true}
console.log(test); // {a: false}
test.a = false; 
console.log(test); // {a: false}

Eu acho que você está procurando console.dir().

console.log()não faz o que você deseja, porque imprime uma referência ao objeto e, quando você o abre, ele é alterado. console.dirimprime um diretório das propriedades no objeto no momento em que você o chama.

A idéia do JSON abaixo é boa; você pode até analisar a string JSON e obter um objeto navegável como o que .dir () daria a você:

console.log(JSON.parse(JSON.stringify(obj)));

O que eu costumo fazer se quiser ver seu estado no momento em que foi registrado é apenas convertido para uma string JSON.

console.log(JSON.stringify(a));

JS de baunilha:

A resposta de @ evan parece melhor aqui. Basta (ab) usar JSON.parse / stringify para efetivamente fazer uma cópia do objeto.

console.log(JSON.parse(JSON.stringify(test)));

Solução específica JQuery:

Você pode criar um instantâneo de um objeto em um determinado momento com jQuery.extend

console.log($.extend({}, test));

O que realmente está acontecendo aqui é que o jQuery está criando um novo objeto com o testconteúdo do objeto e registrando-o (para que não mude).

Solução específica AngularJS (1):

Angular fornece uma copyfunção que pode ser usada para o mesmo efeito:angular.copy

console.log(angular.copy(test));

Função de wrapper Vanilla JS:

Aqui está uma função que envolve console.logmas faz uma cópia de qualquer objeto antes de desconectá-lo.

Escrevi isso em resposta a algumas funções semelhantes, mas menos robustas, nas respostas. Ele suporta vários argumentos e não tentará copiar as coisas se elas não forem objetos regulares .

function consoleLogWithObjectCopy () {
  var args = [].slice.call(arguments);
  var argsWithObjectCopies = args.map(copyIfRegularObject)
  return console.log.apply(console, argsWithObjectCopies)
}

function copyIfRegularObject (o) {
  const isRegularObject = typeof o === 'object' && !(o instanceof RegExp)
  return isRegularObject ? copyObject(o) : o
}

function copyObject (o) {
  return JSON.parse(JSON.stringify(o))
}

exemplo de uso :consoleLogWithObjectCopy('obj', {foo: 'bar'}, 1, /abc/, {a: 1})

Isso > Objectno console não mostra apenas o estado atual. Na verdade, adiar a leitura do objeto e suas propriedades até você expandi-lo.

Por exemplo,

var test = {a: true}
console.log(test);
setTimeout(function () {
    test.a = false; 
    console.log(test);
}, 4000);

Em seguida, expanda a primeira chamada, ela estará correta, se você fizer antes do console.logretorno da segunda

usando a dica do Xeon06, você pode analisar seu JSON em um objeto, e aqui está a função de log que agora uso para despejar meus objetos:

function odump(o){
   console.log($.parseJSON(JSON.stringify(o)));
}

Eu defini um utilitário:

function MyLog(text) {
    console.log(JSON.stringify(text));
}

e quando quero fazer logon no console, simplesmente faço:

MyLog("hello console!");

Funciona muito bem!

Convém registrar o objeto de uma maneira legível por humanos:

console.log(JSON.stringify(myObject, null, 2));

Isso recua o objeto com 2 espaços em cada nível.

Como posso imprimir JSON usando JavaScript?

Há uma opção para usar uma biblioteca de depurador.

https://debugjs.net/

Basta incluir o script em sua página da web e colocar instruções de log.

<script src="debug.js"></script>

Exploração madeireira

var test = {a: true}
log(test); // {a: true}
test.a = false; 
log(test); // {a: false}

Posso me dar um tiro por sugerir isso, mas isso pode ser dado um passo adiante. Podemos estender diretamente o próprio objeto do console para torná-lo mais claro.

console.logObject = function(o) {
  (JSON.stringify(o));
}

Não sei se isso causará algum tipo de colisão de biblioteca / colapso / ruptura nuclear no continuum do espaço-tempo. Mas funciona lindamente nos meus testes qUnit. :)

Simplesmente atualize a página depois de abrir o console ou abra o console antes de enviar a solicitação para a página de destino ....

Basta imprimir o objeto inteiro no console.

console.dir(object);