JS输出内容为[object Object]

问题描述

项目中，欲在控制台输出变量res（自定义对象）查看数据，代码为：

console.log('res:' + res);

但控制台显示结果为res: [object Object]，并非想要查看的数据。

问题原因

1. 加号的作用

首先，我们的代码中有+（加号）运算符，它在这种情况下（字符串 + 其它什么东西），会调用toString()方法，将其它类型的东西转化为字符串，再和原始字符串拼接成一个字符串；

2. toString()从哪里来，干了什么？

以下摘自MDN：

• 除了null和undefined之外，其他的类型(数值、布尔、字符串、对象)都有toString()方法，它返回相应值的字符串表现(并不修改原变量)。
• 每个对象都有一个toString()方法。
• 当该对象被表示为一个文本值时，或者一个对象以预期的字符串方式引用时自动调用。
• 默认情况下，toString()方法被每个Object对象继承。如果此方法在自定义对象中未被覆盖，toString()返回 “[object type]“，其中type是对象的类型。

而在上述项目中，res正是我们自定义的对象，所以res.toString()的结果为[object Object]，所以console.log('res:' + res)的结果为res: [object Object]。

解决方法

1. 去掉字符串‘res’，直接输出对象res
2. 代码改写如下:

console.log(JSON.stringify(user))

Tips：一些补充

(1).toString()      // "1"

[1,2].toString()    // "1, 2"

({}).toString()     // [object Object]

true.toString()     // "true"

null.toString()     // Uncaught TypeError: Cannot read property 'toString' of null

undefined.toString()  // Uncaught TypeError: Cannot read property 'toString' of null

• 第3行，不能直接写成{}.toString()是因为：{}会被当成代码块而不是空对象