Ajax::prototype 源码解读

2019-06-03 08:36:20刘景俊

 * 首先由 Class.create() 创建一个 PeriodicalExecuter 类型, 
 * 然后用对象直接量的语法形式设置原型。 
 * 
 * 需要特别说明的是 rgisterCallback 方法,它调用上面定义的函数原型方法bind, 并传递自己为参数。 
 * 之所以这样做,是因为 setTimeout 默认总以 window 对象为当前对象,也就是说,如果 registerCallback 方法定义如下的话: 
 *     registerCallback: function() { 
 *         setTimeout(this.onTimerEvent, this.frequency * 1000); 
 *     } 
 * 那么,this.onTimeoutEvent 方法执行失败,因为它无法访问 this.currentlyExecuting 属性。 
 * 而使用了bind以后,该方法才能正确的找到this,也就是PeriodicalExecuter的当前实例。 
 */ 
var PeriodicalExecuter = Class.create(); 
PeriodicalExecuter.prototype = { 
  initialize: function(callback, frequency) { 
    this.callback = callback; 
    this.frequency = frequency; 
    this.currentlyExecuting = false; 

    this.registerCallback(); 
  }, 

  registerCallback: function() { 
    setTimeout(this.onTimerEvent.bind(this), this.frequency * 1000); 
  }, 

  onTimerEvent: function() { 
    if (!this.currentlyExecuting) { 
      try { 
        this.currentlyExecuting = true; 
        this.callback(); 
      } finally { 
        this.currentlyExecuting = false; 
      } 
    } 

    this.registerCallback(); 
  } 


/*--------------------------------------------------------------------------*/ 

/** 
 * 这个函数就 Ruby 了。我觉得它的作用主要有两个 
 * 1.  大概是 document.getElementById(id) 的最简化调用。 
 * 比如:$("aaa") 将返回上 aaa 对象 
 * 2.  得到对象数组 
 * 比如: $("aaa","bbb") 返回一个包括id为"aaa"和"bbb"两个input控件对象的数组。