Question

我可以在标准JavaScript函数上设置断点吗？例如，每次调用context.beginPath()时，我都可以暂停调试器吗？或者每次调用String.replace()？

更新：标准JavaScript函数的含义是内置于JavaScript引擎中的函数。

Answer 1

是的，您可以通过执行以下两个步骤覆盖原始功能来执行此操作：

制作原始函数的副本（真的参考）：

mylog = console.log;

使用插入debugger语句的副本覆盖原件：

console.log = function(){
    debugger;
    mylog.apply(this, arguments);
}

现在，当调用console.log时，将执行断点。（注意，你必须以不同的方式处理不同的函数参数，具体取决于被覆盖的函数）

以下是使用实例方法的另一个示例，例如String.prototype.replace：

let originalFunction = String.prototype.replace;
String.prototype.replace = function(...args) {
    debugger;
    return originalFunction.call(this, ...args);
}

console.log('foo bar baz'.replace('bar', 'BAR'));

Answer 2

您在寻找调试器声明吗？

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/debugger

Answer 3

有三种方法可以设置断点并调试代码。

<强> 1。 Chrome开发工具/ Firebug：

使用Chrome开发者工具或firebug来定位   JavaScript，然后用鼠标设置断点。在chrome中，你   应首先打开（ctrl + shirt + I）打开开发人员工具。

选择脚本选项卡或单击（ctrl + P）打开所需文件。

搜索要设置断点的行并设置   断点。

下次在浏览器中执行代码时，断点   被解雇了。在观察部分，您可以看到所有表达式   范围内的变量，以及调用堆栈。

<强> 2。调试器

使用调试器语句，它每次都会触发，它会有所帮助很难找到代码的执行。

debugger;

第3。 Webstorm IDE / Visual Studio代码

Webstorm IDE / Visual Studio Code具有调试代码的功能 IDE。

Javascript是一种非常灵活的语言，可能会采用覆盖现有javascript和调试方法的方式，请使用以下方式进行调试。

var fnSetAttribute = Element.prototype.setAttribute; 
Element.prototype.setAttribute = function(name, value) {
    if (name == 'clone') {
        debugger; /* break if script sets the 'clone' attribute */
    }
    fnSetAttribute.call(this,name,value); /* call original function to
    ensure those other attributes are set correctly */
};

如需更多参考，请查看https://alistapart.com/article/advanced-debugging-with-javascript

如何在标准/本机JavaScript函数中设置断点？

3 个答案: