js的回调函数

转自：http://www.jb51.net/article/59447.htm

回调：函数a有一个参数，这个参数是个函数b，当函数a执行完以后执行函数b。那么这个过程就叫回调。

不带参：

    function  a(callback){
       alert('a');
       callback.call(this);//或者是 callback（）,  callback.apply(this),看个人喜好
   }
    function  b(){
        alert('b');
    }
    //调用
   a(b);

//先弹出 'a'，再弹出‘b'。

带参：

function  c(callback){
       alert('c');
       callback.call(this,'d');
     }
 //调用
c(function(e){
     alert(e);
 });

这里e参数被赋值为'd'，我们只是简单的赋值为字符窜，其实也可以赋值为对象。

Jquery里面也有个e参数。

$("#id").bind('click',function(e){
   //e.pageX ,e.pageY ,e.target.....各种数据
});

这个e参数的赋值也是通过回调函数来实现的，这个参数是用回调参数给它赋予了一个对象值。
还有Ajax里面   $.get('',{},function(data){})    data这个参数也是同样的原理。
Jquery事件对象里面是怎么应用回调函数的

<div  id="container"   style="width:200px;height:200px;background-Color:green;">
 </div>
 <script>
      var   _$=function (id)
                { 
                      this.element=  document.getElementById(id); 
                 }
        _$.prototype={
             bind:function(evt,callback)
             {
                 var   that=this;
                 if(document.addEventListener)
                 {
                     this.element.addEventListener(evt, function(e){
                         callback.call(this,that.standadize(e));
                     }  ,false);
                 }
                 else if(document.attachEvent)
                 {
                     this.element.attachEvent('on'+evt,function(e){
                         callback.call(this,that.standadize(e));
                     });
                 }
                 else
                     this.element['on'+evt]=function(e){
                         callback.call(this,that.standadize(e));
                     };
             },
             standadize:function(e){
                  var  evt=e||window.event;
                  var  pageX,pageY,layerX,layerY;
                  //pageX  横坐标  pageY纵坐标   layerX点击处位于元素的横坐标   layerY点击处位于元素的纵坐标
                 if(evt.pageX)
                  {
                      pageX=evt.pageX;
                      pageY=evt.pageY;
                  }
                  else
                  {
                     pageX=document.body.scrollLeft+evt.clientX-document.body.clientLeft;
                     pageY=document.body.scrollTop+evt.clientY-document.body.clientLTop;
                  }
                  if(evt.layerX)
                  {
                      layerX=evt.layerX;
                      layerY=evt.layerY;
                  }
                  else
                  {
                      layerX=evt.offsetX;
                      layerXY=evt.offsetY;
                  }
                  return  {
                     pageX:pageX,
                     pageY:pageY,
                     layerX:layerX,
                     layerY:layerY
                  }
             }
        }
        window.$=function(id)
        {
           return  new _$(id);
        }
         $('container').bind('click',function(e){
             alert(e.pageX);
         });
         $('container1').bind('click',function(e){
              alert(e.pageX);
         });
 </script>

 
 这段代码我们主要看standadize函数的实现，兼容性的代码，就不多说了，返回的是一个对象 

 return  {
       pageX:pageX,
       pageY:pageY,
       layerX:layerX,
       layerY:layerY
 }

然后再看bind函数里面的代码    callback.call(this,that.standadize(e))，这段代码其实就是给e参数赋值了，是用callback回调实现的。

callback 函数被调用的时候传入的是匿名函数

function(e){
         }

而callback.call(this,that.standadize(e))相当于是执行了这么一段代码 

(function(e){
})(standadize(e))

 
这也是Jquery用回调函数比较经典的地方，e参数就是这么被赋值的