JavaScript 获得代码行号和脚本文件名

比如要写一个 JavaScript 的日志输出工具,在方法 log.info() 中能得到调用它所在的文件和代码行号。和众多的日志工具一样,像 log4j,都是在程序代码中主动抛出异常,然后从异常栈中去查找到调用者所在的代码行和文件名。不过也就刚刚才了解到 JavaScript V8 引擎提供了自己的 StackTrace API,Chrome 和 Node.js 可用。先来看可通用的 JavaScript  抛异常 throw new Error() 的方式,下面的代码:

点击链接 http://jsfiddle.net/Unmi/53xas/ 执行,其中是用 document.write() 输出的,完整异常栈是:

并且成功定位到调用者代码行是

上面是在 Chrome 中运行的效果,在 Firefox/Safari 中有所不同,是用 @ 代替了 at,所以在 Fairfox/Safari 中输出的异常栈是

得到代码行

注意,我都是在 fiddle.jshell.net 上测试我的 JavaScript 代码,fiddle 相当于拿到你的脚本生成一个文件来执行的,所以脚本文件都成了 fiddle 上的某个脚本文件,实际应用中就是你的文件的 URL,比如 special.js。

上面可以稍加改造作为一个简单的日志工具来使用,再辅以传入参数 JSON 序列化 和 Ajax 提交消息到后台,就完整了。

每次想到日志工具,不能不想到各种 log4XX,如 log4j, log4php, log4perl, log4cpp 等不一而足。那么有没有 log4javascript 呢,当然有,那就是 http://log4javascript.org/。这个工具不错,提供了 Popup 或 In-page console 不同颜色级别来显示日志,也可以把日志用 Ajax 发送到后面记录在服务端,并能记录异常,显示出错所在行和文件。

如果你使用的是 V8 引擎,Chrome 和 Node.js 所用的,那么你可以利用 JavaScriptStackTraceApi 来获得行号信息,有两个 API:

Error.captureStackTrace()
Error.prepareStackTrace()

在 Chrome 中可运行下面的代码:

点击链接 http://fiddle.jshell.net/Unmi/EE9gM/ 在 Chrome 中运行类似的代码。在 Firefox/Safari 中得不到结果。

参考:1. JavaScript new Exception(name,message)
              2. Javascript中获取出错代码所在文件及行数

类别: Web/JS. 标签: . 阅读(3,774). 订阅评论. TrackBack.

Leave a Reply

Be the First to Comment!

avatar
wpDiscuz