zoukankan      html  css  js  c++  java
  • javascript 的回调函数

      既然函数可以像其他数据那样赋值给某个个变量,可以被定义、删除、拷贝,那为什么就不能被当成参数传递给其他函数呢?

      下面的示例中,我们定义了一个以两个函数为参数的函数。该函数会分别执行这两个参数函数,并返回它们的返回值之和。 

    function invoke_and_add(a,b){
        return a() + b();            
    }

      现在让我们来简单定义一下这两个参与加法运算的函数,它们只是单纯地返回一个硬编码值: 

    function one(){
        return 1;
    }
    function two(){
        return 2;    
    }

      下面,我们只需将这两个函数传递给目标函数 invoke_and_add(),就可以得到执行结果了:

      invoke_and_add(one ,two);

      3

      事实上,我们也可以直接用匿名函数来代替one()和two(),以作为目标函数的参数,例如:

      invoke_and_add(function(){return 1;},function(){return 2;})

      当我们将函数A传递给函数B,并由B来执行A时,A就成了一个回调函数(callback functions)。如果这时A还是一个无名函数,我们就称它为匿名回调函数。

      那么,应该什么时候使用回调函数呢?下面就让我们通过几个应用实例来示范一下回调函数的优势。

      * 它可以让我们在不做命名的情况下传递函数(这意味着可以节省全局变量)。

      * 我们可以将一个函数调用操作委托给另一个函数(这意味着可以节省一些代码编写工作)。

      * 它们也有助于提升性能。

      回调示例:

      在编程过程中,我们通常需要将一个函数的返回值传递给另一个函数。在下面的例子中,我们定义了两个函数:第一个multiplayByTwo(),该函数会通过一个循环将其所接受的三个参数分别乘以2,并以数组的形式返回结果;第二个函数addOne()只接受一个值,然后将它加1并返回即可。 

    function multiplyByTwo(a,b,c){
        var i,ar =[];
        for (i=0;i<3;i++){
        ar[i] = arguments[i]*2;
    }
        return ar;        
    }
    
    function addOne(a){
        return a+1;
    }

      现在,我们来测试一下这两个函数:

      multiplyByTwo(1,2,3);

      [2,4,6]

      addOne(100)

      101

      接下来,我们要实现这三个元素在两个函数之间的传递,这需要定义一个用于存储元素的数组。我们先从multiplyByTwo()的调用开始:

      var myarr =[];

      myarr=multiplyByTwo(10,20,30);

      [20,40,60]

      然后,用循环遍历每个元素,并将它们分别传递给addOne()。

      for(var i=0;i<3;i++){myarr[i] =addOne(myarr[i]);}

      myarr

      [21,41,61]

      如你所见,这段代码可以工作,但是显然还有一定的改善空间。特别是这里使用了两个循环,如果数据量很大或循环操作很复杂的话,开销一定不小。因此,我们需要将它们合二为一。这就需要对multiplyByTwo()函数做一些改动,使其接受一个回调函数,并在每次迭代操作中调用它。具体如下: 

    function multiplyByTwo(a,b,c,callback)
    {
        var i,ar=[];
        for(i=0;i<3;i++){
            ar[i]=callback(arguments[i]*2);
        }
        return ar;
    }

      函数修改完成之后,之前的工作只需要一次函数调用就够了,我们只需像下面这样将初始值和回调函数传递给它即可:

      myarr= multiplyByTwo(1,2,3,addOne);

      [3,5,7]

      我们还可以用匿名函数来代替addOne(),这样做可以节省一个额外的全局变量。

      myarr= multiplyByTwo(1,2,3,function(a){return a +1});

      [3,5,7]

      而且,使用匿名函数也更易于随时根据需求调整代码。例如:

      myarr = multiplyByTwo(1,2,3,function(a){return a +2});

      [4,6,8]

      

  • 相关阅读:
    利用JS实现的根据经纬度计算地球上两点之间的距离
    html中meta标签作用详解
    Jquery Highcharts 参数配置说明
    Properties类的使用示例
    利用数据库模版创建方便部署的.Net项目调试环境
    ASP.NET修改Web.Config文件(对xml的操作)
    创建动态数据输入用户界面
    DataGrid相关知识总结(收集自各位老大处)
    在C#.net中如何操作XML
    C#中使用反射的性能分析
  • 原文地址:https://www.cnblogs.com/zychengzhiit1/p/4502258.html
Copyright © 2011-2022 走看看