我正在使用以下方法获取 JavaScript 调用函数名称：
var callerFunc = arguments.callee.caller.toString();
callerFuncName = (callerFunc.substring(callerFunc.indexOf("function") + 8, callerFunc.indexOf("(")) || "anoynmous")
有没有办法找出调用该方法的行号？
另外，有没有办法获取调用该方法的 JavaScript 文件的名称？还是来源网址？
【问题讨论】：
标签： javascript
如果您需要非常完整和准确的东西，对于 v8（意味着 NodeJS 和 Chrome）有 stack-trace 包，它对我有用：
https://www.npmjs.com/package/stack-trace
这有几个优点：能够产生深度堆栈跟踪，能够遍历 async 调用，以及在每个堆栈帧处提供脚本的完整 URL。
您可以找到有关 v8 堆栈跟踪 API here 的更多信息。
如果您需要在更多浏览器中工作的东西，有这个包：
https://www.npmjs.com/package/stacktrace-js
该库解析您通常在 devtools 控制台中看到的格式化堆栈跟踪字符串，这意味着它只能访问实际出现在格式化堆栈跟踪中的信息 - 与 v8 API 不同，您无法获取（在其他东西）堆栈框架中脚本的完整 URL。
请注意，解析格式化的堆栈跟踪是一种有点脆弱的方法，因为这种格式可能会在浏览器中发生变化，这会破坏您的应用程序。
据我所知，跨浏览器没有比这更安全的选择了 - 如果您需要在所有浏览器中都能运行的快速、准确和完整的东西，那么您就很不走运了。
【讨论】：
过去更容易，但这次有了浏览器更新：
这是安全的多浏览器解决方案
<!DOCTYPE html>
<html lang="en">
<head>
<script>
var lastErr;
function errHand(e) {
lastErr = e;
switch (e.target.nodeName) {
case 'SCRIPT':
alert('script not found: ' + e.srcElement.src);
break;
case 'LINK':
alert('css not found: ' + e.srcElement.href);
}
return false;
}
window.onerror = function (msg, url, lineNo, columnNo, error) {
alert(msg + ' - ' + url + ' - ' + lineNo + ' - ' + columnNo);
return false;
}
</script>
<script src="http://22.com/k.js" onerror="errHand(event)"></script>
<link rel="stylesheet" href="http://22.com/k.css" onerror="errHand(event)" type="text/css" />
</head>
<body>
<script>
not_exist_function();
</script>
</body>
</html>
对于 NodeJS - 全局错误处理解决方案
process.on('uncaughtException', function (err) {
console.error('uncaughtException:\n' + err.stack + '\n');
})
这非常有用，因为它会向您显示存在但不会破坏您的主程序进程的错误。
【讨论】：
令我惊讶的是，这些答案中的大多数都假设您想要处理错误，而不是仅仅为正常情况输出有用的调试跟踪。
例如，我喜欢像这样使用console.log 包装器：
consoleLog = function(msg) {//See https://stackoverflow.com/a/27074218/470749
var e = new Error();
if (!e.stack) {
try {
// IE requires the Error to actually be thrown or else the
// Error's 'stack' property is undefined.
throw e;
} catch (e) {
if (!e.stack) {
//return 0; // IE < 10, likely
}
}
}
var stack = e.stack.toString().split(/\r\n|\n/);
if (msg === '') {
msg = '""';
}
console.log(msg, ' [' + stack[1] + ']');
}
这最终会在我的控制台上打印如下输出：
1462567104174 [getAllPosts@http://me.com/helper.js:362:9]
见https://stackoverflow.com/a/27074218/ 和A proper wrapper for console.log with correct line number?
【讨论】：
if (!e.stack) 的作用域是什么？这看起来像是一个 python 程序员的指纹;-)
if (!e.stack)try{...} 和 catch{...} 只是悬空。有没有专业 js 的人想解析上面的代码？我是一个 C 人，所以对我来说，这应该会在那个悬空的 catch 语句中引发错误
我意识到这是一个老问题，但现在有一个名为console.trace("Message") 的方法会显示行号和导致日志的方法调用链以及您传递的消息。有关 javascript 日志记录技巧的更多信息，请访问 here at freecodecamp 和 this medium blog post
【讨论】：
console.log(new Error);
它将向您展示整个曲目。
【讨论】：
这就是我的做法，我已经在 Firefox 和 Chrome 中测试过了。这样可以检查调用函数的位置的文件名和行号。
logFileAndLineNumber(new Error());
function logFileAndLineNumber(newErr)
{
if(navigator.userAgent.indexOf("Firefox") != -1)
{
var originPath = newErr.stack.split('\n')[0].split("/");
var fileNameAndLineNumber = originPath[originPath.length - 1].split(">")[0];
console.log(fileNameAndLineNumber);
}else if(navigator.userAgent.indexOf("Chrome") != -1)
{
var originFile = newErr.stack.split('\n')[1].split('/');
var fileName = originFile[originFile.length - 1].split(':')[0];
var lineNumber = originFile[originFile.length - 1].split(':')[1];
console.log(fileName+" line "+lineNumber);
}
}
【讨论】：
行号实际上是静态的，所以如果你只是想要它来记录，那么它可以用 gulp 之类的东西进行预处理。我已经写了一个小的 gulp plugin 就是这样做的：
var gulp = require('gulp');
var logLine = require('gulp-log-line');
gulp.task('log-line', function() {
return gulp.src("file.js", {buffer : true})
//Write here the loggers you use.
.pipe(logLine(['console.log']))
.pipe(gulp.dest('./build'))
})
gulp.task('default', ['log-line'])
这会将文件名和行附加到来自 console.log 的所有日志中，因此 console.log(something) 将变为 console.log('filePath:fileNumber', something)。优点是现在你可以连接你的文件，转译它们......你仍然会得到这条线
【讨论】：
我对 JavaScript 中自定义错误的贡献：
首先，我同意Inheriting from the Error object - where is the message property? 的这个@BT 家伙，我们必须正确构建它（实际上你必须使用js 对象库，我最喜欢：https://github.com/jiem/my-class）：
window.g3 = window.g3 || {};
g3.Error = function (message, name, original) {
this.original = original;
this.name = name || 'Error.g3';
this.message = message || 'A g3.Error was thrown!';
(original)? this.stack = this.original.stack: this.stack = null;
this.message += '<br>---STACK---<br>' + this.stack;
};
var ClassEmpty = function() {};
ClassEmpty.prototype = Error.prototype;
g3.Error.prototype = new ClassEmpty();
g3.Error.prototype.constructor = g3.Error;
然后，我们应该定义一个全局错误处理函数（可选），否则它们将最终交给引擎：
window.onerror = printError;
function printError(msg, url, line){
document.getElementById('test').innerHTML = msg+'<br>at: '+url+'<br>line: '+line;
return true;
}
最后，我们应该小心抛出自定义错误：
//hit it!
//throw new g3.Error('Hey, this is an error message!', 'Error.Factory.g3');
throw new g3.Error('Hey, this is an error message!', 'Error.Factory.g3', new Error());
只有在将第三个参数作为new Error() 传递时，我们才能看到带有函数和行号的堆栈！
在2处，该函数也可以处理引擎抛出的错误。
当然，真正的问题是我们是否真的需要它以及何时需要它；在某些情况下（我认为 99%），优雅地返回 false 就足够了，只留下一些关键点来显示抛出错误。
【讨论】：
以下代码适用于我在 Mozilla 和 Chrome 中。
它的日志功能，显示文件的名称和调用者的行。
log: function (arg) {
var toPrint = [];
for (var i = 0; i < arguments.length; ++i) {
toPrint.push(arguments[i]);
}
function getErrorObject(){
try { throw Error('') } catch(err) { return err; }
}
var err = getErrorObject(),
caller;
if ($.browser.mozilla) {
caller = err.stack.split("\n")[2];
} else {
caller = err.stack.split("\n")[4];
}
var index = caller.indexOf('.js');
var str = caller.substr(0, index + 3);
index = str.lastIndexOf('/');
str = str.substr(index + 1, str.length);
var info = "\t\tFile: " + str;
if ($.browser.mozilla) {
str = caller;
} else {
index = caller.lastIndexOf(':');
str = caller.substr(0, index);
}
index = str.lastIndexOf(':');
str = str.substr(index + 1, str.length);
info += " Line: " + str;
toPrint.push(info);
console.log.apply(console, toPrint);
}
【讨论】：
SyntaxError: function statement requires a name,log: function (arg) {
这是我根据这个论坛上的信息写的：
这是 MyDebugNamespace 的一部分，Debug 显然是保留的，不会用作命名空间名称。
var DEBUG = true;
...
if (true == DEBUG && !test)
{
var sAlert = "Assertion failed! ";
if (null != message)
sAlert += "\n" + message;
if (null != err)
sAlert += "\n" + "File: " + err.fileName + "\n" + "Line: " + err.lineNumber;
alert(sAlert);
}
...
如何调用：
MyDebugNamespace.Assert(new Error(""), (null != someVar), "Something is wrong!")
我在我的命名空间中包含了两个具有可变数量参数的函数调用此基本代码，以便选择性地忽略调用中的消息或错误。
这适用于 Firefox、IE6 和 Chrome 报告 fileName 和 lineNumber 为未定义。
【讨论】：
看来我有点晚了 :)，但是讨论很有趣所以.. 就这样吧...假设您要构建一个错误处理程序，并且您正在使用自己的异常处理程序类，例如：
function errorHandler(error){
this.errorMessage = error;
}
errorHandler.prototype. displayErrors = function(){
throw new Error(this.errorMessage);
}
你正在像这样包装你的代码：
try{
if(condition){
//whatever...
}else{
throw new errorHandler('Some Error Message');
}
}catch(e){
e.displayErrors();
}
您很可能会将错误处理程序放在单独的 .js 文件中。
您会注意到，在 firefox 或 chrome 的错误控制台中，显示的代码行号（和文件名）是引发“错误”异常的行（文件），而不是您真正想要的“errorHandler”异常使调试变得容易。抛出你自己的异常很好，但在大型项目中定位它们可能是一个相当大的问题，特别是如果它们有类似的消息。因此，您可以做的是将对实际空 Error 对象的引用传递给您的错误处理程序，该引用将包含您想要的所有信息（例如，在 Firefox 中，您可以获得文件名和行号等。 ; 在 chrome 中，如果您读取 Error 实例的 'stack' 属性，您会得到类似的东西）。 长话短说，你可以这样做：
function errorHandler(error, errorInstance){
this.errorMessage = error;
this. errorInstance = errorInstance;
}
errorHandler.prototype. displayErrors = function(){
//add the empty error trace to your message
this.errorMessage += ' stack trace: '+ this. errorInstance.stack;
throw new Error(this.errorMessage);
}
try{
if(condition){
//whatever...
}else{
throw new errorHandler('Some Error Message', new Error());
}
}catch(e){
e.displayErrors();
}
现在您可以获得引发自定义异常的实际文件和行号。
【讨论】：
这在 chrome/QtWebView 中适用于我
function getErrorObject(){
try { throw Error('') } catch(err) { return err; }
}
var err = getErrorObject();
var caller_line = err.stack.split("\n")[4];
var index = caller_line.indexOf("at ");
var clean = caller_line.slice(index+2, caller_line.length);
【讨论】：
var caller_line = (new Error).stack.split("\n")[4]
这通常是通过从当前上下文中抛出错误来实现的；然后分析错误对象的属性，如lineNumber 和fileName（某些浏览器有）
function getErrorObject(){
try { throw Error('') } catch(err) { return err; }
}
var err = getErrorObject();
err.fileName;
err.lineNumber; // or `err.line` in WebKit
不要忘记 callee.caller 属性已被弃用（并且从未真正在 ECMA 第 3 版中。首先）。
【讨论】：
callee.caller。
line。
kangax 的解决方案引入了不必要的 try..catch 范围。如果您需要在 JavaScript 中访问某些内容的行号（只要您使用的是 Firefox 或 Opera），只需访问 (new Error).lineNumber。
【讨论】：
如果您想知道行号以用于调试目的，或者仅在开发期间（出于某种原因），您可以使用Firebug（Firefox 扩展）和throw 例外。
编辑：
如果出于某种原因您确实需要在生产中执行此操作，您可以预处理您的 javascript 文件，以便每个函数跟踪它所在的行。我知道一些找到代码覆盖率的框架使用这个（例如JSCoverage）。
例如，假设您的原始调用是：
function x() {
1 + 1;
2 + 2;
y();
}
你可以写一个预处理器把它变成：
function x() {
var me = arguments.callee;
me.line = 1;
1 + 1;
me.line = 2;
2 + 2;
me.line = 3;
y();
}
那么在y()中，你可以使用arguments.callee.caller.line知道它是从哪一行调用的，比如：
function y() {
alert(arguments.callee.caller.line);
}
【讨论】：
要确定某行在哪一行，您必须在所有代码中搜索占据特定感兴趣行的代码，并从顶部到感兴趣的行数“\n”字符并加 1。
我实际上是在我正在编写的应用程序中做这件事。它是 HTML 的最佳实践验证器，并且仍在大量开发中，但您会感兴趣的错误输出过程已经完成。
【讨论】：
答案很简单。没有和没有（否）。
到 javascript 运行时，源文件/url 的概念已经不复存在了。
也无法确定行号，因为在执行时代码“行”的概念在 Javascript 中不再有意义。
特定实现可能会提供 API 挂钩，以允许特权代码访问此类详细信息以进行调试，但这些 API 不会暴露给普通的标准 Javascript 代码。
【讨论】：