JavaScript 更改控制台调用堆栈我想要什么

如何解决JavaScript 更改控制台调用堆栈我想要什么

正确的行为

当我直接从函数调用 console.log() 时，我调用的堆栈（函数和文件）在开发工具控制台中是正确的，正如预期的那样。

main.js：

function main() {
    // Works correctly
    console.log('Hello from main()!');
}

控制台：

Hello from main()!    ...    main.js:3

我想要什么

现在，当我添加第二个名为 debug.js 的文件并从那里调用 console.log 时，我调用的文件是 debug.js，这是正确的...但我需要 { {1}} 来记录，就像在 debug() 中调用一样。不知何故，我需要修改调用者、堆栈或跟踪以欺骗 main.js 它是从 console.log() 调用的，而实际上它是从 main.js 调用的。

代码

deubg.js：

debug.js

function debug(msg) { console.log(msg) }

main.js

行为

当前行为：

function main() {
   debug('Hello world!') // debug() in debug.js
}

我想要的行为：

Hello world!    ...    debug.js:2

解决方法

我认为这里的问题是控制台日志通常从它运行的任何地方执行。但是，如果您要传回一个执行控制台日志的函数，这可能会如您所愿。你可以试试下面的代码吗？

尝试 #1

debug.js：

function debug(msg) {
   return (function(msg) { console.log(msg) })(msg)
}

main.js：

function main() {
   debug('Hello world!')
}

如果这不起作用，你可以试试这个：

尝试#2

debug.js：

function debug() {
   return function(msg) { console.log(msg) }
}

main.js：

function main() {
   debug()('Hello world!')
}

正如 WHATWG specification 所说，每个函数（错误、警告、日志等）的控制台输出都是特定于实现的：

打印机操作是实现定义的

碰巧的是，基于铬的浏览器在打印 console.log 的结果时会显示调用堆栈的当前帧（而不是完整的调用堆栈），您将无法更改此行为，因为这与 JavaScript 引擎有关（V8 用于基于 Chrome 的浏览器），并且无法通过 JavaScript 代码进行自定义。

允许您显示完整调用堆栈的唯一 JavaScript 标准是 console.trace，其规范在这里：https://console.spec.whatwg.org/#trace

它将为您的示例代码显示如下内容：

你可以做的是：

const log = console.log // for future use,preserve the default function
console.log = (...args) => {
    console.trace(...args)
}

在节点上：

console.log = (...args) => {
    console.trace(...args,path.basename(__filename))
}

要得到这样的东西：

const path = require("path");
console.log = (...args) => {
  console.trace(...args,path.basename(__filename))
}

function f() {
  return function g() {
    console.log("test")
  }
}

f()()

这可以通过创建 Error 实例 new Error() 来完成，它将以字符串形式保存跟踪，如下所示。

function debug(...args) {
    const error = new Error();
    console.log(...args,error.stack.replace(/.+\n.+\n/,''))
}

虽然 MDN Error stack 文档说这是一个非标准属性，但似乎所有浏览器都支持 Browser compatibility

JavaScript 更改控制台调用堆栈 我想要什么

如何解决JavaScript 更改控制台调用堆栈 我想要什么