在 console.log 中自动化/覆盖/扩展前缀以进行调试

Question

任何人都有扩展 console.log 的好解决方案，以便它自动打印 class 名称和方法作为前缀？ 我正在使用 web 组件并启用严格使用。

someFunction() {
  let varA = "hello"
  console.log(this.constructor.name, "someFunction", {varA})
}

想自动化这部分：this.constructor.name, "someFunction", ...

arguments.callee.name 将打印 function 名称，但在开启严格模式时不再有效。 通过以下方式在集中位置扩展 console.log：

export var log = function(){
  var args = Array.prototype.slice.call(arguments);
  args.unshift(this.constructor.name + ": ");
  console.log.apply(console, args);
}

不起作用，因为 this.constructor.name 不打印正确的上下文，如果它不在 web 组件中，它根本不起作用。
在每个 web 组件中扩展 console.log 会破坏目的（或一半）。 可以折叠一个 function，它在构建中为每个 web 组件扩展 console.log，但仍然会遇到无法调用 arguments.calleee 的问题。 使用 lit-element，但这是本机 javascript 问题。

Answer 1

console.trace()可能在这里有用，而不是自定义控制台方法。 或者，使用new Error()的.stack属性。

 class A { b() { return function c() { return function d() { return (function e() { return new Error().stack; })(); } } } } console.log("here's the stack:\n", new A().b()()());

Answer 2

所以根据 sean-7777 的回答，我想我们可以像这样对堆栈 output 进行切片：

let funcname = new Error().stack.split('\n')[1];
funcname=funcname.slice(funcname.indexOf("at ")+3, funcname.indexOf(" ("));
console.log(debugline, 'debug text');

如果你把它放到一个 helper function 中，你可以只获取行索引 2（因为索引 1 会给你 helper 函数的名称）。

我希望有一些更直接的东西，但破解 output 确实有效。

更新：

export function prtfun() {
  let debugline = new Error().stack.split('\n')[2];
  return debugline.slice(debugline.indexOf("at ")+3, debugline.indexOf(" ("));
}

从这样的任何地方调用它：console.log(prtfun(), 'log text...');

它将打印 ClassName.FunctionName 日志文本...

效果很好。 我会在生产中禁用它。