无法读取未定义的函数

Question

我正在尝试创建另一种扩展 $.event.special 对象的事件类型。因为我需要更改与输入类型不同的元素。问题是当我启动页面时控制台给了我这个错误：

main.js:5 Uncaught TypeError: Cannot read property 'mutationsLists' of undefined

脚本是这样的：

(function($){

 $.event.special.changeElement = {
    eventType: 'changeElement',
    mutationObserver : new MutationObserver($.event.special.changeElement.mutationsLists),

    setup: function(data, namespaces) {
      var config = { attributes: true, childList: true };
      $.event.special.changeElement.mutationObserver.observe(this, config);
    },

    teardown: function(namespaces) {
      $.event.special.changeElement.mutationObserver.disconnect();
    },

    handler: function(event) {
      event.type = $.event.special.changeElement.eventType;
      return $.event.dispatch.apply(this, arguments);
    },

    mutationsLists : function(mutationsList) {
      for(var mutation of mutationsList) {
          if (mutation.type == 'childList') {
              console.log('A child node has been added or removed.');
          }
          else if (mutation.type == 'attributes') {
              console.log('The ' + mutation.attributeName + ' attribute was modified.');
          }
      }
    }

  }

})(jQuery);

我检查了一下，它看起来 $.event.special.changeElement 已定义，但在调用其成员时看起来未定义...

Answer 1

mutationLists 是 $.event.special.changeElement 的一个属性，它是一个函数。将属性作为对象的函数充当函数表达式，这意味着在到达代码之前未定义。有关这方面的示例，请参阅此jsFiddle。

您会在那个小提琴中看到firstFunction 可以调用secondFunction，因为它是在它之前定义的。但是，secondFunction 不能调用 thirdFunction，因为它在调用 firstFunction 之前没有定义。

要纠正您的问题，请先定义函数 mutationLists，然后再定义属性 mutationObserver。