How to debounce an event? (wrong Syntax?)

问题

I'am a little bit confused. I would like do debounce the function resizeAd on windows-resize. I played with this code but without any result. The debouncing is not done. How I have to call the debouncing-function in this case?

The debouncing function works fine by calling them like this: var resizeIframeAd = debounce(function() {... }

    (function(window, document, undefined) {
        'use strict';
        /*
         * Global api.
         */
        var adTech = window.adTech = {
            get: function() {
                return _instance;
            },
            //Main entry point.
            init: function(options) {
                return _instance || new ADTECH(options);
            }
        };
        /**
         * Constructor.
         */
        var ADTECH = function(options) {
            var defaultOptions = {
              adID : '5202402',
              hiddenClassName : 'hidden'
            };
            this.options = this.extend(options, defaultOptions);

            this.makeAd();
            _instance = this;
            return _instance;
        }


     ADTECH.prototype = {
        extend: function(source, target) {
          if (source == null) { return target; }
          for (var k in source) {
            if(source[k] != null && target[k] !== source[k]) {
              target[k] = source[k];
            }
          }
          return target;
        },
        log: function(msg){
          if(window.console){
            console.log(msg);
          }
        },
         // Debounce function
        debounce:  function(func, wait, immediate) {
          var timeout;
          return function() {
              var context = this, args = arguments;
              var later = function() {
                  timeout = null;
                  if (!immediate) func.apply(context, args);
              };
              var callNow = immediate && !timeout;
              clearTimeout(timeout);
              timeout = setTimeout(later, wait);
              if (callNow) func.apply(context, args);
          };
        },
        // event Handler
        addEvent: function (elem, type, eventHandle) {     console.log("adEvent is undefined: ",eventHandle);
            if (elem == null || typeof(elem) == 'undefined') return;
            if (elem.addEventListener) {
                elem.addEventListener(type, eventHandle, false);
            } else if (elem.attachEvent) {
            elem.attachEvent("on" + type, eventHandle);
            } else {
                elem["on" + type] = eventHandle;
            }
        },

//to debounce this fucntion I call them like this var resizeIframeAd = debounce(function() {    HOW TO DO THAT HERE?


        resizeAd: function(invokeLater) {
            // this is explicitly set based on the calling object.
            var obj = this;
            var helper = function () {
               obj.log("resizeAd2 done.");
               //var ad = document.getElementById(obj.options.adID);    //obj.log(ad);
               obj.debounce(function() {
                   console.log("please debounce this function");
               }, 250)
            };
            // if invokeLater is a falsey value do the resizing right away
            // if it is truthy return helper so that it can be assigned as
            // an event handler
            return invokeLater ? helper : helper();
        },
        // insert ad
        makeAd: function () {
                    this.addEvent(window, "resize", this.resizeAd(true));
        }

     }
        // Singleton
        var _instance;
    }(window, document));


    var API = adTech.init();

回答1:

I think you want to debounce your helper function:

var helper = this.debounce(function () {
   obj.log("resizeAd2 done.");
   //var ad = document.getElementById(obj.options.adID);    //obj.log(ad);
   console.log("please debounce this function");
}, 250);

来源：https://stackoverflow.com/questions/29697116/how-to-debounce-an-event-wrong-syntax