javascript 字符串文字意外行为

Question

谁能解释为什么下面的控制台日志会产生不同的输出，而我希望它们完全相同？

'use strict';

const objectSelected = document.querySelector('.message');

console.log(`${objectSelected}`);
console.log(objectSelected);

Answer 1

在字符串模板中传递对象时，它会被转换为字符串。这就是为什么第一个语句会导致 [object <something>].

第二个将按原样打印值（作为对象）。将对象传递给 console.log 时，它将作为完整对象打印。

Answer 2

console.log 旨在显示有关对象的详细信息，如果您记录一个对象。它不只是调用对象的 toString 方法（如果您尝试在需要字符串的上下文中使用对象，则会隐式调用该方法）。

Answer 3

控制台将记录任何类型的值：对象、数组、函数、布尔值、数字等。任何时候将非字符串放入字符串或将非字符串与字符串连接时，JavaScript 将在非字符串的事物上调用 .toString()：

var obj = { foo: 'bar' }
console.log(obj)             //-> { foo: "bar" }
console.log(obj.toString()). //-> "[object Object]"
console.log('' + obj).       //-> "[object Object]"
console.log(`${obj}`).       //-> "[object Object]"

javascript 字符串文字意外行为

javacript string literal unexpected behaviour

javascript

string

literals