【问题标题】：Javascript ES6 console.log object using template literal使用模板文字的 Javascript ES6 console.log 对象
【发布时间】：2017-11-19 16:49:29
【问题描述】：

我想在控制台中显示一个简单的对象

var obj = { name: 'John', age: 22 }

如果我输入：

console.log(obj)

对象{名称：“约翰”，年龄：22 }

如果我输入：

console.log('my object is: ' + obj)

我的对象是：[object Object]

console.log('my object is: %o', obj)

我的对象是：对象{名称：“约翰”，年龄：22 }

如何使用模板文字来实现这一点？

如果我输入：

console.log(`my object is: ${obj}`)

我的对象是：[object Object]

【问题讨论】：

也可以这样做：console.log('my object is: ', obj);。模板本身在制作对象的字符串表示方面并不聪明，因此您无法纯粹从模板文字中获得所需的输出。他们只是调用默认的字符串转换，这不是你想要的。您必须自己制作所需的字符串表示并将其传递给文字。

标签： javascript ecmascript-6 template-literals

【解决方案1】：

您可以使用JSON.stringify 序列化对象。

var obj = { name: 'John', age: 22 };
console.log(`my object is: ${JSON.stringify(obj)}`);

【讨论】：

【解决方案2】：

console.logMy object is: ${obj};

灰色部分的两端有波浪线（`），但格式正在删除它们

【讨论】：

正如目前所写，您的答案尚不清楚。请edit 添加其他详细信息，以帮助其他人了解这如何解决所提出的问题。你可以找到更多关于如何写好答案的信息in the help center。

【解决方案3】：

var obj = { name: 'John', age: 22 }
log`This is obj: ${obj}`

function log(strings, ...values) {
   console.log(strings.reduce((p, c, i) => 
        `${p}${c}${values[i]?JSON.stringify(values[i]):''}`, ''));
}

【讨论】：

这样一种过于复杂的方式来执行一个简单的操作。接受的答案可以达到目的。