Como mostrar o objeto completo no console do Chrome?

155

var functor=function(){
    //test
}

functor.prop=1;

console.log(functor);

isso mostra apenas a parte da função do functor, não pode mostrar as propriedades do functor no console.

javascript debugging google-chrome lovespring
fonte

245

Use console.dir()para gerar um objeto navegável no qual você pode clicar em vez da .toString()versão, desta forma:

console.dir(functor);

Imprime uma representação JavaScript do objeto especificado. Se o objeto que está sendo registrado for um elemento HTML, as propriedades de sua representação DOM serão impressas ^[1]

[1] https://developers.google.com/web/tools/chrome-devtools/debug/console/console-reference#dir

Nick Craver
fonte

1

Note-se que apenas imprimir varNameno console do Chrome e pressionar Enter dá o mesmo efeito que console.dir(varName).

Vadzim

118

Você pode obter melhores resultados se tentar:

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

BastiBen
fonte

esta resposta é grande, mas eu acho que não funciona com o exemplo acima, tentou em uma nova aba e retorna indefinido

aitorllj93

1

Com todo o devido respeito a essa resposta, eventualmente ela retorna uma sequência que representa o objeto, e não um objeto "navegável" no console, como a pergunta é sobre aqui. É verdade que, se você executar essa string de saída através do JSON.parse, ela retornará ao formato de objeto, mas o console ainda mostrará uma ".toString ()" e voltaremos à estaca zero. A resposta aqui com o uso de "console.dir" é a melhor opção para a pergunta em questão.

TheCuBeMan

21

Você pode obter resultados ainda melhores se tentar:

console.log(JSON.stringify(obj, null, 4));

Trident D'Gao
fonte

Esta resposta melhora as do @ BastiBen, formatando a saída.

Xeoncross

12

var gandalf = {
  "real name": "Gandalf",
  "age (est)": 11000,
  "race": "Maia",
  "haveRetirementPlan": true,
  "aliases": [
    "Greyhame",
    "Stormcrow",
    "Mithrandir",
    "Gandalf the Grey",
    "Gandalf the White"
  ]
};
//to console log object, we cannot use console.log("Object gandalf: " + gandalf);
console.log("Object gandalf: ");
//this will show object gandalf ONLY in Google Chrome NOT in IE
console.log(gandalf);
//this will show object gandalf IN ALL BROWSERS!
console.log(JSON.stringify(gandalf));
//this will show object gandalf IN ALL BROWSERS! with beautiful indent
console.log(JSON.stringify(gandalf, null, 4));

Kean Amaral
fonte

8

isso funcionou perfeitamente para mim:

for(a in array)console.log(array[a])

você pode extrair qualquer matriz criada no console para localizar / substituir a limpeza e o uso posterior desses dados extraídos

domSurgeon
fonte

3

um pouco mais detalhado:for (i in arr) { console.log(i); console.log(arr[i]); }

Geo

não irá propriedades de saída e métodos que não são enumeráveis

Barbu Barbu

0

Eu escrevi uma função para imprimir convenientemente as coisas no console.

// function for debugging stuff
function print(...x) {
    console.log(JSON.stringify(x,null,4));
}

// how to call it
let obj = { a: 1, b: [2,3] };
print('hello',123,obj);

irá produzir no console:

[
    "hello",
    123,
    {
        "a": 1,
        "b": [
            2,
            3
        ]
    }
]

John Henckel
fonte

0

Nos navegadores modernos, console.log(functor)funciona perfeitamente (comporta-se da mesma forma que a console.dir).

akim
fonte

0

Fiz uma função da resposta de Trident D'Gao.

function print(obj) {
  console.log(JSON.stringify(obj, null, 4));
}

Como usá-lo

print(obj);

Jens Törnell
fonte

-5

Para gerar obj:

console.log(obj, null, 4)

Kulakov Serg
fonte

Como mostrar o objeto completo no console do Chrome?

Respostas: