javascript - 调试器中的console.log行号

我正在寻找一种使日志功能简单的方法。

我正在调用函数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(“that work”)。

最佳答案

通过在Function.prototype.bind上使用console.log而获得的功能将指向调用它的行号。它有一定的局限性，但是如果您只想传递一个字符串参数，它将起作用:

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

经过Firefox和Chrome的测试。

对于更复杂的行为，您可以手动将包含日志记录功能的脚本添加到黑名单，如this answer for Chrome中所述，并通过激活Firefox中调试器中脚本上的“blackbox”按钮(在{} Pretty print source旁边，一个眼睛图标)。