javascript：控制台日志使用父范围

Question

是否可以使用一些 javascript 技巧来告诉 console.log 它应该输出哪个行号？

假设，我们下面这个简单的例子：

function Logger () {
    this.debug = function(msg) {
        // do some stuff with msg
        console.log(msg);
    };
}

var log = new Logger();
log.debug("Hello");

如果您打开该页面，Chrome 会显示以下内容：

这表明该消息记录在main.js:4，但我真正想要的是它显示main.js:9。因为第 9 行是调用记录器的位置。 对于这个简单的情况，它并没有太大的区别，但是当 Logger 在一个单独的文件中时，它总是显示 logger.js 而不是调用 logger 的类。

Logger 类应该对记录的消息做一些额外的事情（例如，将其发送到服务器），因此我不能只使用this.debug = console.log。

编辑：

已经有一些类似的问题了，不过都是在输出中多加了一行，不能点击跳转到对应的行：

• Extending console.log without affecting log line
• console.log wrapper that keeps line numbers and supports most methods?
• Get console wrapper to log message on correct line
• Getting Chrome's console.log to display the line that called a function
• Custom console.log that keeps line number
• Intercept console.log but keep stack
• https://stackoverflow.com/questions/28457477/javascript-console-log-change-line-number-to-somewhere-higher-in-the-stack?rq=1

Answer 1

我首先想到的是创建一个新的Error 对象来获取堆栈跟踪，然后找到调用您的方法的行，如下所示：

function Logger () {
    this.debug = function(msg) {
        // do some stuff with msg

        //TODO: document this line
        var callerLine = new Error().stack.split('\n')[2];
        console.log(msg, callerLine);
    };
}

var log = new Logger();
log.debug("Hello");

基本上，我在每个换行符中拆分错误堆栈，并忽略第一行和第二行（分别是错误消息和您自己在堆栈中的方法）。