JAVA流通橋

          JAVA啟發(fā)者

          統(tǒng)計

          留言簿(3)

          AJAX相關(guān)網(wǎng)址

          Eclipse相關(guān)網(wǎng)址

          Hibernate

          java相關(guān)網(wǎng)址

          LINUX相關(guān)網(wǎng)址

          webwork相關(guān)網(wǎng)址

          友好鏈接

          閱讀排行榜

          評論排行榜

          深入認(rèn)識JavaScript中的函數(shù)

          一、概述
          函數(shù)是進行模塊化程序設(shè)計的基礎(chǔ),編寫復(fù)雜的Ajax應(yīng)用程序,必須對函數(shù)有更深入的了解。JavaScript中的函數(shù)不同于其他的語言,每個函數(shù)都是作為一個對象被維護和運行的。通過函數(shù)對象的性質(zhì),可以很方便的將一個函數(shù)賦值給一個變量或者將函數(shù)作為參數(shù)傳遞。在繼續(xù)講述之前,先看一下函數(shù)的使用語法:
          function func1(…){…}
          var func2=function(…){…};
          var func3=function func4(…){…};
          var func5=new Function();
          這些都是聲明函數(shù)的正確語法。它們和其他語言中常見的函數(shù)或之前介紹的函數(shù)定義方式有著很大的區(qū)別。那么在JavaScript中為什么能這么寫?它所遵循的語法是什么呢?下面將介紹這些內(nèi)容。

          二、  認(rèn)識函數(shù)對象(Function Object)
          可以用function關(guān)鍵字定義一個函數(shù),并為每個函數(shù)指定一個函數(shù)名,通過函數(shù)名來進行調(diào)用。在JavaScript解釋執(zhí)行時,函數(shù)都是被維護為一個對象,這就是要介紹的函數(shù)對象(Function Object)。
          函數(shù)對象與其他用戶所定義的對象有著本質(zhì)的區(qū)別,這一類對象被稱之為內(nèi)部對象,例如日期對象(Date)、數(shù)組對象(Array)、字符串對象(String)都屬于內(nèi)部對象。這些內(nèi)置對象的構(gòu)造器是由JavaScript本身所定義的:通過執(zhí)行new Array()這樣的語句返回一個對象,JavaScript內(nèi)部有一套機制來初始化返回的對象,而不是由用戶來指定對象的構(gòu)造方式。
          在JavaScript 中,函數(shù)對象對應(yīng)的類型是Function,正如數(shù)組對象對應(yīng)的類型是Array,日期對象對應(yīng)的類型是Date一樣,可以通過new Function()來創(chuàng)建一個函數(shù)對象,也可以通過function關(guān)鍵字來創(chuàng)建一個對象。為了便于理解,我們比較函數(shù)對象的創(chuàng)建和數(shù)組對象的創(chuàng)建。先看數(shù)組對象:下面兩行代碼都是創(chuàng)建一個數(shù)組對象myArray:
          var myArray=[];
          //等價于
          var myArray=new Array();
          同樣,下面的兩段代碼也都是創(chuàng)建一個函數(shù)myFunction:
          function myFunction(a,b){
                return a+b;
          }
          //等價于
          var myFunction=new Function("a","b","return a+b");
          通過和構(gòu)造數(shù)組對象語句的比較,可以清楚的看到函數(shù)對象本質(zhì),前面介紹的函數(shù)聲明是上述代碼的第一種方式,而在解釋器內(nèi)部,當(dāng)遇到這種語法時,就會自動構(gòu)造一個Function對象,將函數(shù)作為一個內(nèi)部的對象來存儲和運行。從這里也可以看到,一個函數(shù)對象名稱(函數(shù)變量)和一個普通變量名稱具有同樣的規(guī)范,都可以通過變量名來引用這個變量,但是函數(shù)變量名后面可以跟上括號和參數(shù)列表來進行函數(shù)調(diào)用。
          用new Function()的形式來創(chuàng)建一個函數(shù)不常見,因為一個函數(shù)體通常會有多條語句,如果將它們以一個字符串的形式作為參數(shù)傳遞,代碼的可讀性差。下面介紹一下其使用語法:
          var funcName=new Function(p1,p2,...,pn,body);
          參數(shù)的類型都是字符串,p1到pn表示所創(chuàng)建函數(shù)的參數(shù)名稱列表,body表示所創(chuàng)建函數(shù)的函數(shù)體語句,funcName就是所創(chuàng)建函數(shù)的名稱。可以不指定任何參數(shù)創(chuàng)建一個空函數(shù),不指定funcName創(chuàng)建一個無名函數(shù),當(dāng)然那樣的函數(shù)沒有任何意義。
          需要注意的是,p1到pn是參數(shù)名稱的列表,即p1不僅能代表一個參數(shù),它也可以是一個逗號隔開的參數(shù)列表,例如下面的定義是等價的:
          new Function("a", "b", "c", "return a+b+c")
          new Function("a, b, c", "return a+b+c")
          new Function("a,b", "c", "return a+b+c")
          JavaScript引入Function類型并提供new Function()這樣的語法是因為函數(shù)對象添加屬性和方法就必須借助于Function這個類型。
          函數(shù)的本質(zhì)是一個內(nèi)部對象,由JavaScript解釋器決定其運行方式。通過上述代碼創(chuàng)建的函數(shù),在程序中可以使用函數(shù)名進行調(diào)用。本節(jié)開頭列出的函數(shù)定義問題也得到了解釋。注意可直接在函數(shù)聲明后面加上括號就表示創(chuàng)建完成后立即進行函數(shù)調(diào)用,例如:
          var i=function (a,b){
                 return a+b;
          }(1,2);
          alert(i);
          這段代碼會顯示變量i的值等于3。i是表示返回的值,而不是創(chuàng)建的函數(shù),因為括號“(”比等號“=”有更高的優(yōu)先級。這樣的代碼可能并不常用,但當(dāng)用戶想在很長的代碼段中進行模塊化設(shè)計或者想避免命名沖突,這是一個不錯的解決辦法。
          需要注意的是,盡管下面兩種創(chuàng)建函數(shù)的方法是等價的:
          function funcName(){
                 //函數(shù)體
          }
          //等價于
          var funcName=function(){
                 //函數(shù)體
          }
          但前面一種方式創(chuàng)建的是有名函數(shù),而后面是創(chuàng)建了一個無名函數(shù),只是讓一個變量指向了這個無名函數(shù)。在使用上僅有一點區(qū)別,就是:對于有名函數(shù),它可以出現(xiàn)在調(diào)用之后再定義;而對于無名函數(shù),它必須是在調(diào)用之前就已經(jīng)定義。例如:
          <script language="JavaScript" type="text/javascript">
          <!--
          func();
          var func=function(){
                 alert(1)
          }
          //-->
          </script>
          這段語句將產(chǎn)生func未定義的錯誤,而:
          <script language="JavaScript" type="text/javascript">
          <!--
          func();
          function func(){
                alert(1)
          }
          //-->
          </script>
          則能夠正確執(zhí)行,下面的語句也能正確執(zhí)行:
          <script language="JavaScript" type="text/javascript">
          <!--
          func();
          var someFunc=function func(){
                alert(1)
          }
          //-->
          </script>
          由此可見,盡管JavaScript是一門解釋型的語言,但它會在函數(shù)調(diào)用時,檢查整個代碼中是否存在相應(yīng)的函數(shù)定義,這個函數(shù)名只有是通過function funcName()形式定義的才會有效,而不能是匿名函數(shù)。

          三、  函數(shù)對象和其他內(nèi)部對象的關(guān)系
          除了函數(shù)對象,還有很多內(nèi)部對象,比如:Object、Array、Date、RegExp、Math、Error。這些名稱實際上表示一個類型,可以通過 new操作符返回一個對象。然而函數(shù)對象和其他對象不同,當(dāng)用typeof得到一個函數(shù)對象的類型時,它仍然會返回字符串“function”,而 typeof一個數(shù)組對象或其他的對象時,它會返回字符串“object”。下面的代碼示例了typeof不同類型的情況:
          alert(typeof(Function)));
          alert(typeof(new Function()));
          alert(typeof(Array));
          alert(typeof(Object));
          alert(typeof(new Array()));
          alert(typeof(new Date()));
          alert(typeof(new Object()));
          運行這段代碼可以發(fā)現(xiàn):前面4條語句都會顯示“function”,而后面3條語句則顯示“object”,可見new一個function實際上是返回一個函數(shù)。這與其他的對象有很大的不同。其他的類型Array、Object等都會通過new操作符返回一個普通對象。盡管函數(shù)本身也是一個對象,但它與普通的對象還是有區(qū)別的,因為它同時也是對象構(gòu)造器,也就是說,可以new一個函數(shù)來返回一個對象,這在前面已經(jīng)介紹。所有typeof返回 “function”的對象都是函數(shù)對象。也稱這樣的對象為構(gòu)造器(constructor),因而,所有的構(gòu)造器都是對象,但不是所有的對象都是構(gòu)造器。
          既然函數(shù)本身也是一個對象,它們的類型是function,聯(lián)想到C++、Java等面向?qū)ο笳Z言的類定義,可以猜測到Function類型的作用所在,那就是可以給函數(shù)對象本身定義一些方法和屬性,借助于函數(shù)的prototype對象,可以很方便地修改和擴充Function類型的定義,例如下面擴展了函數(shù)類型Function,為其增加了method1方法,作用是彈出對話框顯示"function":
          Function.prototype.method1=function(){
                alert("function");
          }
          function func1(a,b,c){
                return a+b+c;
          }
          func1.method1();
          func1.method1.method1();
          注意最后一個語句:func1.method1.mehotd1(),它調(diào)用了method1這個函數(shù)對象的method1方法。雖然看上去有點容易混淆,但仔細觀察一下語法還是很明確的:這是一個遞歸的定義。因為method1本身也是一個函數(shù),所以它同樣具有函數(shù)對象的屬性和方法,所有對 Function類型的方法擴充都具有這樣的遞歸性質(zhì)。
          Function是所有函數(shù)對象的基礎(chǔ),而Object則是所有對象(包括函數(shù)對象)的基礎(chǔ)。在JavaScript中,任何一個對象都是Object的實例,因此,可以修改Object這個類型來讓所有的對象具有一些通用的屬性和方法,修改 Object類型是通過prototype來完成的:
          Object.prototype.getType=function(){
                 return typeof(this);
          }
          var array1=new Array();
          function func1(a,b){
                return a+b;
          }
          alert(array1.getType());
          alert(func1.getType());
          上面的代碼為所有的對象添加了getType方法,作用是返回該對象的類型。兩條alert語句分別會顯示“object”和“function”。

          四、  將函數(shù)作為參數(shù)傳遞
          在前面已經(jīng)介紹了函數(shù)對象本質(zhì),每個函數(shù)都被表示為一個特殊的對象,可以方便的將其賦值給一個變量,再通過這個變量名進行函數(shù)調(diào)用。作為一個變量,它可以以參數(shù)的形式傳遞給另一個函數(shù),這在前面介紹JavaScript事件處理機制中已經(jīng)看到過這樣的用法,例如下面的程序?qū)unc1作為參數(shù)傳遞給 func2:
          function func1(theFunc){
                theFunc();
          }
          function func2(){
                alert("ok");
          }
          func1(func2);
          在最后一條語句中,func2作為一個對象傳遞給了func1的形參theFunc,再由func1內(nèi)部進行theFunc的調(diào)用。事實上,將函數(shù)作為參數(shù)傳遞,或者是將函數(shù)賦值給其他變量是所有事件機制的基礎(chǔ)。
          例如,如果需要在頁面載入時進行一些初始化工作,可以先定義一個init的初始化函數(shù),再通過window.onload=init;語句將其綁定到頁面載入完成的事件。這里的init就是一個函數(shù)對象,它可以加入window的onload事件列表。

          五、  傳遞給函數(shù)的隱含參數(shù):arguments
          當(dāng)進行函數(shù)調(diào)用時,除了指定的參數(shù)外,還創(chuàng)建一個隱含的對象——arguments。arguments是一個類似數(shù)組但不是數(shù)組的對象,說它類似是因為它具有數(shù)組一樣的訪問性質(zhì),可以用arguments[index]這樣的語法取值,擁有數(shù)組長度屬性length。arguments對象存儲的是實際傳遞給函數(shù)的參數(shù),而不局限于函數(shù)聲明所定義的參數(shù)列表,例如:
          function func(a,b){
               alert(a);
               alert(b);
               for(var i=0;i<arguments.length;i++){
                     alert(arguments[i]);
               }
          }
          func(1,2,3);
          代碼運行時會依次顯示:1,2,1,2,3。因此,在定義函數(shù)的時候,即使不指定參數(shù)列表,仍然可以通過arguments引用到所獲得的參數(shù),這給編程帶來了很大的靈活性。arguments對象的另一個屬性是callee,它表示對函數(shù)對象本身的引用,這有利于實現(xiàn)無名函數(shù)的遞歸或者保證函數(shù)的封裝性,例如使用遞歸來計算1到n的自然數(shù)之和:
          var sum=function(n){
                if(1==n)return 1;
                else return n+sum(n-1);
          }
          alert(sum(100));
          其中函數(shù)內(nèi)部包含了對sum自身的調(diào)用,然而對于JavaScript來說,函數(shù)名僅僅是一個變量名,在函數(shù)內(nèi)部調(diào)用sum即相當(dāng)于調(diào)用一個全局變量,不能很好的體現(xiàn)出是調(diào)用自身,所以使用arguments.callee屬性會是一個較好的辦法:
          var sum=function(n){
                if(1==n)return 1;
                else return n+arguments.callee(n-1);
          }
          alert(sum(100));
          callee屬性并不是arguments不同于數(shù)組對象的惟一特征,下面的代碼說明了arguments不是由Array類型創(chuàng)建:
          Array.prototype.p1=1;
          alert(new Array().p1);
          function func(){
                 alert(arguments.p1);
          }
          func();
          運行代碼可以發(fā)現(xiàn),第一個alert語句顯示為1,即表示數(shù)組對象擁有屬性p1,而func調(diào)用則顯示為“undefined”,即p1不是arguments的屬性,由此可見,arguments并不是一個數(shù)組對象。

          六、  函數(shù)的apply、call方法和length屬性
          JavaScript為函數(shù)對象定義了兩個方法:apply和call,它們的作用都是將函數(shù)綁定到另外一個對象上去運行,兩者僅在定義參數(shù)的方式有所區(qū)別:
          Function.prototype.apply(thisArg,argArray);
          Function.prototype.call(thisArg[,arg1[,arg2…]]);
          從函數(shù)原型可以看到,第一個參數(shù)都被取名為thisArg,即所有函數(shù)內(nèi)部的this指針都會被賦值為thisArg,這就實現(xiàn)了將函數(shù)作為另外一個對象的方法運行的目的。兩個方法除了thisArg參數(shù),都是為Function對象傳遞的參數(shù)。下面的代碼說明了apply和call方法的工作方式:
          //定義一個函數(shù)func1,具有屬性p和方法A
          function func1(){
                this.p="func1-";
                this.A=function(arg){
                      alert(this.p+arg);
                }
          }
          //定義一個函數(shù)func2,具有屬性p和方法B
          function func2(){
                this.p="func2-";
                this.B=function(arg){
                       alert(this.p+arg);
                }
          }
          var obj1=new func1();
          var obj2=new func2();
          obj1.A("byA");    //顯示func1-byA
          obj2.B("byB");    //顯示func2-byB
          obj1.A.apply(obj2,["byA"]); //顯示func2-byA,其中[“byA”]是僅有一個元素的數(shù)組,下同
          obj2.B.apply(obj1,["byB"]); //顯示func1-byB
          obj1.A.call(obj2,"byA");  //顯示func2-byA
          obj2.B.call(obj1,"byB");  //顯示func1-byB
          可以看出,obj1的方法A被綁定到obj2運行后,整個函數(shù)A的運行環(huán)境就轉(zhuǎn)移到了obj2,即this指針指向了obj2。同樣obj2的函數(shù)B也可以綁定到obj1對象去運行。代碼的最后4行顯示了apply和call函數(shù)參數(shù)形式的區(qū)別。
          與arguments的length屬性不同,函數(shù)對象還有一個屬性length,它表示函數(shù)定義時所指定參數(shù)的個數(shù),而非調(diào)用時實際傳遞的參數(shù)個數(shù)。例如下面的代碼將顯示2:
          function sum(a,b){
                return a+b;
          }
          alert(sum.length);

          七、  深入認(rèn)識JavaScript中的this指針
          this指針是面向?qū)ο蟪绦蛟O(shè)計中的一項重要概念,它表示當(dāng)前運行的對象。在實現(xiàn)對象的方法時,可以使用this指針來獲得該對象自身的引用。
          和其他面向?qū)ο蟮恼Z言不同,JavaScript中的this指針是一個動態(tài)的變量,一個方法內(nèi)的this指針并不是始終指向定義該方法的對象的,在上一節(jié)講函數(shù)的apply和call方法時已經(jīng)有過這樣的例子。為了方便理解,再來看下面的例子:
          <script language="JavaScript" type="text/javascript">
          <!--
          //創(chuàng)建兩個空對象
          var obj1=new Object();
          var obj2=new Object();
          //給兩個對象都添加屬性p,并分別等于1和2
          obj1.p=1;
          obj2.p=2;
          //給obj1添加方法,用于顯示p的值
          obj1.getP=function(){
                alert(this.p); //表面上this指針指向的是obj1
          }
          //調(diào)用obj1的getP方法
          obj1.getP();
          //使obj2的getP方法等于obj1的getP方法
          obj2.getP=obj1.getP;
          //調(diào)用obj2的getP方法
          obj2.getP();
          //-->
          </script>
          從代碼的執(zhí)行結(jié)果看,分別彈出對話框顯示1和2。由此可見,getP函數(shù)僅定義了一次,在不同的場合運行,顯示了不同的運行結(jié)果,這是有this指針的變化所決定的。在obj1的getP方法中,this就指向了obj1對象,而在obj2的getP方法中,this就指向了obj2對象,并通過this指針引用到了兩個對象都具有的屬性p。
          由此可見,JavaScript中的this指針是一個動態(tài)變化的變量,它表明了當(dāng)前運行該函數(shù)的對象。由 this指針的性質(zhì),也可以更好的理解JavaScript中對象的本質(zhì):一個對象就是由一個或多個屬性(方法)組成的集合。每個集合元素不是僅能屬于一個集合,而是可以動態(tài)的屬于多個集合。這樣,一個方法(集合元素)由誰調(diào)用,this指針就指向誰。實際上,前面介紹的apply方法和call方法都是通過強制改變this指針的值來實現(xiàn)的,使this指針指向參數(shù)所指定的對象,從而達到將一個對象的方法作為另一個對象的方法運行。
          每個對象集合的元素(即屬性或方法)也是一個獨立的部分,全局函數(shù)和作為一個對象方法定義的函數(shù)之間沒有任何區(qū)別,因為可以把全局函數(shù)和變量看作為window對象的方法和屬性。也可以使用new操作符來操作一個對象的方法來返回一個對象,這樣一個對象的方法也就可以定義為類的形式,其中的this指針則會指向新創(chuàng)建的對象。在后面可以看到,這時對象名可以起到一個命名空間的作用,這是使用JavaScript進行面向?qū)ο蟪绦蛟O(shè)計的一個技巧。例如:
          var namespace1=new Object();
          namespace1.class1=function(){
               //初始化對象的代碼
          }
          var obj1=new namespace1.class1();
          這里就可以把namespace1看成一個命名空間。
          由于對象屬性(方法)的動態(tài)變化特性,一個對象的兩個屬性(方法)之間的互相引用,必須要通過this指針,而其他語言中,this關(guān)鍵字是可以省略的。如上面的例子中:
          obj1.getP=function(){
                alert(this.p); //表面上this指針指向的是obj1
          }
          這里的this關(guān)鍵字是不可省略的,即不能寫成alert(p)的形式。這將使得getP函數(shù)去引用上下文環(huán)境中的p變量,而不是obj1的屬性。

          posted on 2007-05-25 10:04 朱巖 閱讀(215) 評論(0)  編輯  收藏 所屬分類: JavaScript文章

          主站蜘蛛池模板: 宁南县| 翁牛特旗| 黄梅县| 繁峙县| 安泽县| 韶山市| 藁城市| 怀安县| 甘肃省| 全南县| 安庆市| 古丈县| 广东省| 蒲城县| 革吉县| 朝阳县| 龙江县| 庆安县| 大埔县| 龙川县| 富裕县| 栾城县| 赤水市| 澄迈县| 土默特左旗| 长阳| 惠水县| 浠水县| 观塘区| 洪雅县| 安平县| 临湘市| 娱乐| 建湖县| 邻水| 定安县| 工布江达县| 阿拉善右旗| 罗甸县| 东城区| 繁峙县|