如何使用 console.dir("string"+object) 的控制台

Question

这是我的代码：

var foo = {
    age:20
}

console.dir(`hello:${foo}`)

我希望

hello:{ age: 201 }

但是我得到了

'hello:[object Object]'

如果我不想使用

console.log("hello")
console.dir(foo)

有没有办法在一个控制台函数中打印 "hello" 和对象的内容？

Answer 1

.dir 期望传递一个对象，并将其显示为 table。 .log 用于记录任何内容（包括字符串）。因此，如果您想将一个字符串和一个对象记录为 table，您需要两种不同的功能，或者换句话说：两种不同的功能。

如果你这样做一次，那么编写一个 3 行函数来将两行缩减为一行（实际上是四行）是没有意义的。但是，如果您打算更频繁地这样做，那么...

 Object.defineProperty(console, "taggedDir", {
    value(name, table) {
       this.log(name);
       this.dir(table);
    }
});

console.taggedDir("Table:", { /*...*/ });

Answer 2

只需使用JSON.stringify。发生的事情是，当您使用字符串插值 ${} 时，将调用 toString 方法 - 在一个对象上，其结果是 [object Object]:

console.log({}.toString());

JSON.stringify 将对象或数组转换为字符串，但保留内容并避免 toString 输出。所以就这样使用它：

var foo = {
  age: 20
};

console.dir(`hello:${JSON.stringify(foo)}`)

另请注意，dir 用于显示对象的不同属性。最好只使用 console.log，这意味着您可以完全避免 JSON.stringify：

var foo = {
  age: 20
};

console.log("hello:", foo);

如何使用 console.dir("string"+object) 的控制台

How to use console with console.dir("string"+object)

javascript

console

object

ecmascript-6

console.log