关于console.table()自动移除值中额外空格的技术咨询

现象说明 #

• 当数组元素是带竖线（|）前额外空格的字符串时，用console.table()输出会自动删掉这些空格；
• 但用console.log()输出相同内容，带空格的字符串能正常显示。

示例代码：

var exampleArray = [
  "First item in the array   | CONNECTS-AGENDA",
  "I'm the second item in this array   | CONNECTS-AGENDA",
  "Obviously i'm the last item   | CONNECTS-AGENDA"
];
console.table(exampleArray);

原因 #

console.table()内部会做格式化处理，它会把字符串里的竖线当成表格列的分隔标记，自动去掉竖线前的多余空格来对齐列，所以原字符串里的空格就被截断了。而console.log()只是原样输出字符串，不会搞这些格式化操作。

解决办法 #

如果既要保留空格又想用表格展示，可以把数组元素改成对象，让console.table()按对象属性渲染列，就不会把竖线当成分隔符了：

var exampleArray = [
  { 内容: "First item in the array   | CONNECTS-AGENDA" },
  { 内容: "I'm the second item in this array   | CONNECTS-AGENDA" },
  { 内容: "Obviously i'm the last item   | CONNECTS-AGENDA" }
];
console.table(exampleArray);

要是不需要表格形式，直接用console.log()输出原始内容就行。

内容的提问来源于stack exchange，提问作者Arav KT