注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

星期五

明天不上班

 
 
 

日志

 
 
关于我

一个特立独行的Java程序员,比较宅,上上网,写博客,听音乐,看电影。

网易考拉推荐

JavaScript回调函数  

2012-09-10 21:44:26|  分类: Javascript |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
什么是Javascript 回调函数?
函数和其他数据一样可以被赋值,删除,拷贝等,所以也可以把函数作为参数传入到另一个函数中。
这个函数就是所谓的回调函数

举例:
//不带参数的case
function A(b, c) {
    return b() + c();
}

function B() {
    return 10;
}

function C() {
    return 7;
}

console.log(A(B, C));

//带参数的case
//(将参数重组后,传入d, 作为回调函数的参数,这里给我们提供了灵活性,回调函数的参数,完全由我们做主) 
function A(m, n, fun) {
    var d = m+n;
    return fun(d);
}

function fun(c) {
    return c
}

console.log(A(5, 4, fun));

//result (firebug 测试结果)
JavaScript回调函数 - 星期五 - 星期五
 

Javascript call和apply方法 
call和apply方法用于切换方法的执行上下文,这是一个非常酷的特性。(它两个的区别是参数形式不一样,作用相同)

区分apply,call就一句话,

foo.call(this, arg1,arg2,arg3) == foo.apply(this, arguments) == this.foo(arg1, arg2, arg3)
 
call, apply都属于Function.prototype的一个方法,它是JavaScript引擎内在实现的,因为属于Function.prototype,所以每个Function对象实例,也就是每个方法都有call, apply属性.既然作为方法的属性,那它们的使用就当然是针对方法的了.这两个方法是容易混淆的,因为它们的作用一样,只是使用方式不同.

call, apply方法区别是,从第二个参数起, call方法参数将依次传递给借用的方法作参数, 而apply直接将这些参数放到一个数组中再传递, 最后借用方法的参数列表是一样的.

举例:用B的setMessage方法给A的message属性赋值
function funA(){
    this.message;
    this.getMessage = function() {
        return this.message;
    } 
}

function funB(){
    this.message;
    this.setMessage = function(msg) {
        this.message = msg;
    }
}

var b = new funB();
var a = new funA();
b.setMessage.call(a, "this is a's message!");

console.log(a.getMessage());


//Not Work Case:
//如果message是私有属性就不work
function funA(){
    var message;
    this.getMessage = function() {
        return message;
    } 
}

function funB(){
    var message;
    this.setMessage = function(msg) {
        message = msg;
    }
}

var b = new funB();
var a = new funA();
b.setMessage.call(a, "this is a's message!");

console.log(a.getMessage());

//result (firebug 测试结果)
JavaScript回调函数 - 星期五 - 星期五
 

举例:为数组增加两个方法,其中用到回调函数
Function.prototype.method = function(name, fn) {
    this.prototype[name] = fn;
    return this;
}

if ( !Array.prototype.forEach ) { 
  //这里fn 作为回调函数,我们为它定义了三个参数 数组元素,数组元素的序号,数组本身
  Array.method('forEach', function(fn, thisObj) {
    var scope = thisObj || window;
    for ( var i = 0, len = this.length; i < len; ++i ) {
      fn.call(scope, this[i], i, this);
    }
  });
}

if ( !Array.prototype.filter ) {
  Array.method('filter', function(fn, thisObj) {
    var scope = thisObj || window;
    var a = [];
    for ( var i = 0, len = this.length; i < len; ++i ) {
      if ( !fn.call(scope, this[i], i, this) ) {
        continue;
      }
      a.push(this[i]);
    }
    return a;
  });
}

举例测试:
Function.prototype.method = function(name, fn) {
    this.prototype[name] = fn;
    return this;
}

if ( !Array.prototype.forEach ) { 
  Array.method('forEach', function(fn, thisObj) {
    var scope = thisObj || window;
    for ( var i = 0, len = this.length; i < len; ++i ) {
      fn.call(scope, this[i], i, this);
    }
  });
}

//因为Javascript参数是可变的,所以定义callback方法时,参数个数自己选择,但是注意顺序
var a = function(item, i, array) {
    console.log("array[" + i + "] ->" + item + "    array:" + array);
}

var array = [1, 28, '163', 4, 'javascript'];

array.forEach(a);

//result: (firebug测试结果)
JavaScript回调函数 - 星期五 - 星期五
 
  评论这张
 
阅读(4462)| 评论(0)
推荐

历史上的今天

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017