调试模式下定义的函数立即消失

Question

在断点期间，我在控制台中定义了一个函数（如here所述），但我无法在控制台中使用它（“未定义”错误）。

为什么我刚刚定义的一个函数马上就消失了？我该如何使用它？

Answer 1

如何使用？

方法 1：首先加载页面，然后运行代码段。

方法二：将函数breakOn定义为变量（匿名函数表达式）如果你想在断点激活时成功定义它（由'root'指出）

var breakOn = function (obj, propertyName, mode, func) {
    // this is directly from https://github.com/paulmillr/es6-shim
    var getPropertyDescriptor = function (obj, name) {
        var property = Object.getOwnPropertyDescriptor(obj, name);
        var proto = Object.getPrototypeOf(obj);
        while (property === undefined && proto !== null) {
            property = Object.getOwnPropertyDescriptor(proto, name);
            proto = Object.getPrototypeOf(proto);
        }
        return property;
    }

    var verifyNotWritable = function() {
        if (mode !== 'read')
            throw "This property is not writable, so only possible mode is 'read'.";
    }

    var enabled = true;
    var originalProperty = getPropertyDescriptor(obj, propertyName);
    var newProperty = { enumerable: originalProperty.enumerable };

    // write
    if (originalProperty.set) {// accessor property
        newProperty.set = function(val) {
            if(enabled && (!func || func && func(val)))
                debugger;
            
            originalProperty.set.call(this, val);
        }
    } else if (originalProperty.writable) {// value property
        newProperty.set = function(val) {
            if(enabled && (!func || func && func(val)))
                debugger;

            originalProperty.value = val;
        }
    } else  {
        verifyNotWritable();
    }

    // read
    newProperty.get = function(val) {
          if(enabled && mode === 'read' && (!func || func && func(val)))
            debugger;

        return originalProperty.get ? originalProperty.get.call(this, val) : originalProperty.value;
    }

    Object.defineProperty(obj, propertyName, newProperty);

    return {
      disable: function() {
        enabled = false;
      },

      enable: function() {
        enabled = true;
      }
    };
};

例如在控制台（或代码段末尾）输入 breakOn(document.body, 'clientWidth', 'read')，如果在断点处继续执行代码，然后使用 document.body.clientWidth.

访问（读取）控制台中 document.body 对象的属性 'clientWidth'

这应该使片段代码在调试器语句处停止。现在可以使用调用堆栈来查看谁或什么更改了属性，在本例中为 'anonymous'.

Answer 2

调试器似乎丢弃了使用 function foo() {} 格式定义的函数，但保留了使用 foo = function() {}.

格式定义的函数

调试模式下定义的函数立即消失

Function defined in debug mode immediately disappears

javascript

google-chrome-devtools