JavaScript面向对象编程指南(三) 函数

第3章函数

3.1 什么是函数

函数：本质是一种代码的分组形式。函数的声明如下：

  <script type="text/javascript">

     /*函数的声明组成：function关键字、函数名称如sum、参数、

                       函数体（执行的代码块）、return子句*/

         function sum(a,b){

             return a+b;

         }

     </script>

3.1.1 调用函数

调用函数的方式：在函数名后面加一对用以传递参数的括号。如调用如上sum()函数。

> var result=sum(1,3);

> result;

4

3.1.2 参数

调用时忘记传递参数值，将自动设置为undefined，如

> sum(1);//1于undefined相加

NaN

参数分为形参与实参。形参：sum(a,b)；实参：sum(1,3)。
可以通过arguments变量访问函数的参数。通过arguments变量完善sum()函数，对任意数量的参数执行求和运算。代码如下：

 // arguments.length返回参数的数量

 function sum1(){

         var res=0;

         for (var i = 0; i < arguments.length; i++) {

             res+=arguments[i];

         };

         return res;

       }

3.2 预定义函数

内建函数：parseInt()、parseFloat()、isNaN()、isFinite()、eval()等。

3.3 变量的作用域

JavaScript以函数作为作用域，不是以代码块作为作用域。

   <script type="text/javascript">

     //在函数内可以访问个local

     //在函数外local不存在

         var global=1;

         function f(){

             var local=2;//声明变量没用使用var语句，该变量就会默认为全局变量

             global++;

             return global;

         }

      f();//

      f();//

      local;// local is not defined

     </script>

变量提升

     <script type="text/javascript">

     //函数域优先于全局域，局部变量a会覆盖和它同名的全局变量

     //被提升的只有函数的声明

         var a=123;

         function f(){

             alert(a);//undefined

             var a=1;

             alert(a);//

         }

         /*

         等价于：

         var a=123;

         function f(){

            var a;

            alert(a);//undefined

              a=1;

             alert(a);// 1

         }

          */

         f();

     </script>

3.4 函数也是数据

函数也是数据，可以把一个函数赋值给一个变量。

函数表达式

 <script type="text/javascript">

    //函数标识记法 函数表达式

        var f=function (){

            return 1;

        };

    //函数声明

        function f1(){

            return 1;

        }

    </script>

函数作为数据的特点：

1>包含的是代码 2>可执行的

var sum=function(a,b){return a+b};

var add=sum;

typeof add; //"fucntion"

add(1,2);  //

3.4.1 匿名函数

<script type="text/javascript">

        var f=function (a){

            return a;

        }
 </script>

用法：1>作为参数传递给其它函数 2>执行某些一次性任务

3.4.2 回调函数

如果将函数A传递给函数B,并由B来执行函数A,A就成为一个回调函数.

 <script type="text/javascript">

     // 如果将函数A传递给函数B,并由B来执行函数A,A就成为一个回调函数

         function add(a,b){

            return a()+b();

         }

         function one(){

             return 1;

         }

         function two(){

             return 2;

         }

         add(one,two);//

     //可是使用匿名函数(函数表达式)，作为目标函数的参数

         add(

          function(){return 1;},

          function(){return 2;}

             );       // 3

     </script>

回调函数的优势：

1>在不做命名的情况下传递函数（节省变量名的使用）

2>将一个函数的调用操作委托给另一个函数（节省代码的编写工作）

3>有助于提升性能

3.4.3 回调示例

先将函数的三个参数分别乘以2，在加1。代码如下：

  <script>

     //编写一个函数，将其所有的参数乘以2

         // function multipleByTwo(a,b,c){

         //   var i,ar=[];

         //   for (var i = 0; i < 3; i++) {

         //       ar[i]=arguments[i]*2;

         //            }

         //      return ar;

         // }

     //函数的参数加1

     function addOne(a){

       return a+1;

     }

     // 如果要实现三个元素在两个函数之间传递，先分别乘以2在加上1

     // 1.可以定义一个数组，来存储第一步的结果

        /*

         var myarr=[];

        myarr=multipleByTwo(21,33,2);

      for (var i = 0; i < 3; i++) {

          myarr[i]=addOne(myarr[i]);

      };

      myarr;

      */

     // 2.使用回调函数

     function multipleByTwo(a,b,c,callback){

         var i,ar=[];

         for (var i = 0; i < 3; i++) {

             ar[i]=callback(arguments[i]*2);

               };

               return ar;

     }

    // multipleByTwo(1,2,3,addOne);  //[3, 5, 7]

    // 可以使用匿名函数来代替addOne(),节省全局变量

    multipleByTwo(1,2,3,function(a){

          return a+1;

    });                              //[3, 5, 7]

     </script>

3.4.4 即时函数

函数在定义后立即调用。

 <script type="text/javascript">

     //第二个函数起着立即调用的作用

         (

          function (){

             alert('a');

          }

         )();

     //或者第一对括号闭合在第二对之后

        (function(){

         alert('a');

        }

        ());

     //可以在第二个括号中传递参数

     (

       function (name){

         alert('hello '+name+' !');

       }

     )('dude');

     </script>

3.4.5 内部(私有)函数

在一个函数内部定义另一个函数。

  <script type="text/javascript">

         function outer(param){

             function inner(a){

                 return a*2;

             };

             return 'The result is '+inner(param);

         };

         outer(2);// "The result is 4"

         inner(2);// inner is not defined

     </script>

使用私有函数的好处：

有助于确保全局名字空间的纯净性

确保私有性—只将一些必要的函数暴露出去

3.4.6 返回函数的函数

  <script type="text/javascript">

         function f1(){

             alert('a');

             return function (){

                 alert('b');

             };

         }

       f1()();// 先执行 alert('a');再执行 alert('b');

     </script>

3.4.7 能重写自己的函数

 <script type="text/javascript">

         function a(){

             alert('sa');

             a=function (){

                 alert('qq');

             };

         }

         a()   //第一次调a时是sa

         a()   //第二次调a时是qq

 </script>

3.5 闭包

3.5.1 作用域链

 <script type="text/javascript">

         var a=1;

         function f(){

            var b=2;

            return a;

         };

         f();// 1   在函数内部a、b都是可见的

         b;// b is not defined   在函数外部a是可见的、b则不可见。

  </script>

3.5.1 利用闭包突破作用域链

3.5.1.1 闭包#1

 <script type="text/javascript">

         //返回函数形式的闭包

         var a='glocal variable';

         var F=function(){

             var b='local variable';

             var N=function (){

                 var c='inner variable';

                 return b;

             }

             return N;

         };

         b;  // b is not defined  b在全局函数中不可见

         F();/*返回：function (){

                 var c='inner variable';

                 return b;

             }*/

         F()(); // 返回"local variable"  通过返回函数的闭包使b在全局空间中可见

 </script>

3.5.1.2 闭包#2

     <script type="text/javascript">

         //通过全局函数的占位符，使使局部空间和全局空间连通，实现闭包

         var inner;

         var F=function (){

             var b="local variable";

             var N=function(){

                 return b;

             };

             inner=N;

         };

         F(); //undefined

         inner();//"local variable"

         //如果只执行inner();

         inner();  // inner is not a function

     </script>

3.5.1.3 闭包#3

     <script type="text/javascript">

         //以参数形式形成闭包、

         function F(param){

            var N=function(){

             return param;

            }

            param++;

            return N;

         }

         var inner=F(111);

         inner(); //

     </script>

巴特西

JavaScript面向对象编程指南(三) 函数

第3章函数

3.1 什么是函数

3.1.1 调用函数

3.1.2 参数

3.2 预定义函数

3.3 变量的作用域

3.4 函数也是数据

3.4.1 匿名函数

3.4.2 回调函数

3.4.3 回调示例

3.4.4 即时函数

3.4.5 内部(私有)函数

3.4.6 返回函数的函数

3.4.7 能重写自己的函数

3.5 闭包

3.5.1 作用域链

3.5.1 利用闭包突破作用域链

最新文章

热门文章

巴特西

JavaScript面向对象编程指南(三) 函数

第3章 函数

3.1 什么是函数

3.1.1 调用函数

3.1.2 参数

3.2 预定义函数

3.3 变量的作用域

3.4 函数也是数据

3.4.1 匿名函数

3.4.2 回调函数

3.4.3 回调示例

3.4.4 即时函数

3.4.5 内部(私有)函数

3.4.6 返回函数的函数

3.4.7 能重写自己的函数

3.5 闭包

3.5.1 作用域链

3.5.1 利用闭包突破作用域链

最新文章

热门文章

第3章函数