Quando você faz console.log('Novo Obj ', obj)
, está passando o objeto como um dos argumentos de console.log
(a vírgula separa os argumentos, então a string 'Novo Obj'
é o primeiro argumento, e o objeto é o segundo).
Ou seja, obj
é tratado "isoladamente" e impresso conforme a implementação - ou seja, varia conforme o ambiente: testando no Chrome e no Node, e o resultado foi { a: 1, b: 2, c: 3 }
, no Firefox foi Object { a: 1, b: 2, c: 3 }
, e no snippet do site, o resultado é:
{
"a": 1,
"b": 2,
"c": 3
}
Rode e veja a diferença (aperte F12 e compare a saída do snippet abaixo com o console do seu browser):
const obj = { a: 1, b: 2, c: 3 };
console.log(obj);
Repare que no caso acima, há aspas em volta de a, b e c, e há quebras de linha entre eles (no caso do Chrome e Firefox, obtive o resultado sem as aspas e tudo em uma única linha). O fato é que o resultado de console.log
varia conforme a implementação, mas em linhas gerais, "todas" imprimem os atributos e valores do objeto.
Já quando você coloca o objeto dentro de uma template string, internamente é chamado o seu método toString
. Mas como você não definiu este método no seu objeto, ele usa o método herdado de Object
, que sempre retorna algo como "[object type]" - sendo que type
será o tipo do mesmo, que no seu caso é Object
.
Sendo assim, uma forma de resolver é definir o método toString
no seu objeto:
const obj = { a: 1, b: 2, c: 3,
toString: function() {
return `a=${this.a}, b=${this.b}, c=${this.c}`;
}
};
console.log(`Novo Obj ${obj}`); // Novo Obj a=1, b=2, c=3
Claro que se quiser, pode usar JSON.stringify
(que costuma ser uma maneira rápida, fácil e por isso muito usada para este propósito):
const obj = { a: 1, b: 2, c: 3,
toString: function() {
return JSON.stringify(this);
}
};
console.log(`Novo Obj ${obj}`); // Novo Obj {"a":1,"b":2,"c":3}
// ou use JSON.stringify diretamente
console.log(`Novo Obj ${JSON.stringify(obj)}`); // Novo Obj {"a":1,"b":2,"c":3}
Um porém com JSON.stringify
é quando você tem referências circulares:
let a = { x: 1 };
let b = { y: 2, z: a }; // "b" tem referência para "a"
a['z'] = b; // "a" tem referência para "b"
console.log(JSON.stringify(a)); // erro
Aí você teria que usar algo assim para resolver. Mas aí eu acho mais fácil sobrescrever toString
e colocar os campos que você quer.