调试器中的console.log行号

Question

我正在寻找一种简单的方法来制作日志功能.

我正在调用一个函数logSuc("return from Prom"),该函数在第30行.

因此代码将始终指向该函数的第30行.在控制台中:

所以说有这个代码:

const logSuc = (msg) => {
   console.log(`%c ${msg}`, 'background: green; color: white; display: block;'); 
};

另一种选择可能是:

const log = console.log;
function red(msg) {
  return `%c ${msg}`, 'background: red; color: white; display: block;';
}
log(red('its red');

但现在我有两个功能,我想保持简短

所以问题是我logSuc("") 总是指向第30行.

但我希望它指向我称之为logSuc的行("有效").

Answer 1

Function.prototype.bind使用on得到的函数console.log将指向调用它\xe2\x80\x99s 的行号。它\xe2\x80\x99s有点有限，但如果你只想传递一个字符串参数，它\xe2\x80\x99会工作：

\n\n

const logSuc = console.log.bind(console, \'%c %s\',\n    \'background: green; color: white\');\n

\n\n

在 Firefox 和 Chrome 中进行了测试。

\n\n

对于更复杂的行为，您可以手动黑箱包含日志记录功能的脚本，如Chrome 的此答案中所述，并通过激活 Firefox 中调试器中脚本上的 \xe2\x80\x9cblackbox\xe2\x80\x9d 按钮（旁边{} Pretty print source，眼睛图标）。

\n