編輯“Php-javascript中的函數(shù)”

<span style="text-align:center; border:1px solid #000; float:right; padding:6px;"><strong>導(dǎo)航:</strong> [[PHP#PHP教程|上一頁]] | {{template:開發(fā)語言導(dǎo)航}}</span>
<div style="clear:both;"></div>

函數(shù)是進(jìn)行模塊化程序設(shè)計(jì)的基礎(chǔ)，編寫復(fù)雜的[[Ajax]]應(yīng)用程序，必須對函數(shù)有更深入的了解。[[javascrīpt]]中的函數(shù)不同于其他的語言，每個函數(shù)都是作為一個對象被維護(hù)和運(yùn)行的。通過函數(shù)對象的性質(zhì)，可以很方便的將一個函數(shù)賦值給一個變量或者將函數(shù)作為參數(shù)傳遞。在繼續(xù)講述之前，先看一下函數(shù)的使用語法： <br>

function func1(…){…} <br>
var func2=function(…){…}; <br>
var func3=function func4(…){…}; <br>
var func5=new Function(); <br>

　　這些都是聲明函數(shù)的正確語法。它們和其他語言中常見的函數(shù)或之前介紹的函數(shù)定義方式有著很大的區(qū)別。那么在Javascrīpt中為什么能這么寫？它所遵循的語法是什么呢？下面將介紹這些內(nèi)容。 <br>

　　認(rèn)識函數(shù)對象（Function Object） <br>

　　可以用function關(guān)鍵字定義一個函數(shù)，并為每個函數(shù)指定一個函數(shù)名，通過函數(shù)名來進(jìn)行調(diào)用。在Javascrīpt解釋執(zhí)行時(shí)，函數(shù)都是被維護(hù)為一個對象，這就是要介紹的函數(shù)對象（Function Object）。 <br>

　　函數(shù)對象與其他用戶所定義的對象有著本質(zhì)的區(qū)別，這一類對象被稱之為內(nèi)部對象，例如日期對象（Date）、數(shù)組對象（Array）、字符串對象（String）都屬于內(nèi)部對象。這些內(nèi)置對象的構(gòu)造器是由Javascrīpt本身所定義的：通過執(zhí)行new Array()這樣的語句返回一個對象，Javascrīpt內(nèi)部有一套機(jī)制來初始化返回的對象，而不是由用戶來指定對象的構(gòu)造方式。<br>

　　在Javascrīpt中，函數(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： <br>


var myArray=[]; <br>
//等價(jià)于 <br>
var myArray=new Array(); <br>
同樣，下面的兩段代碼也都是創(chuàng)建一個函數(shù)myFunction： <br>
function myFunction(a,b){ <br>
      return a+b; <br>
} <br>
//等價(jià)于 <br>
var myFunction=new Function("a","b","return a+b"); <br>

　　通過和構(gòu)造數(shù)組對象語句的比較，可以清楚的看到函數(shù)對象本質(zhì)，前面介紹的函數(shù)聲明是上述代碼的第一種方式，而在解釋器內(nèi)部，當(dāng)遇到這種語法時(shí)，就會自動構(gòu)造一個Function對象，將函數(shù)作為一個內(nèi)部的對象來存儲和運(yùn)行。從這里也可以看到，一個函數(shù)對象名稱（函數(shù)變量）和一個普通變量名稱具有同樣的規(guī)范，都可以通過變量名來引用這個變量，但是函數(shù)變量名后面可以跟上括號和參數(shù)列表來進(jìn)行函數(shù)調(diào)用。 <br>

　　用new Function()的形式來創(chuàng)建一個函數(shù)不常見，因?yàn)橐粋€函數(shù)體通常會有多條語句，如果將它們以一個字符串的形式作為參數(shù)傳遞，代碼的可讀性差。下面介紹一下其使用語法：<br>


var funcName=new Function(p1,p2,...,pn,body); <br>

　　參數(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ù)沒有任何意義。 <br>

　　需要注意的是，p1到pn是參數(shù)名稱的列表，即p1不僅能代表一個參數(shù)，它也可以是一個逗號隔開的參數(shù)列表，例如下面的定義是等價(jià)的： <br>


new Function("a", "b", "c", "return a+b+c") <br>
new Function("a, b, c", "return a+b+c") <br>
new Function("a,b", "c", "return a+b+c") <br>

　　Javascrīpt引入Function類型并提供new Function()這樣的語法是因?yàn)楹瘮?shù)對象添加屬性和方法就必須借助于Function這個類型。 <br>
函數(shù)的本質(zhì)是一個內(nèi)部對象，由Javascrīpt解釋器決定其運(yùn)行方式。通過上述代碼創(chuàng)建的函數(shù)，在程序中可以使用函數(shù)名進(jìn)行調(diào)用。本節(jié)開頭列出的函數(shù)定義問題也得到了解釋。注意可直接在函數(shù)聲明后面加上括號就表示創(chuàng)建完成后立即進(jìn)行函數(shù)調(diào)用，例如： <br>


var i=function (a,b){ <br>
       return a+b; <br>
}(1,2); <br>
alert(i); <br>

　　這段代碼會顯示變量i的值等于3。i是表示返回的值，而不是創(chuàng)建的函數(shù)，因?yàn)槔ㄌ枴?”比等號“=”有更高的優(yōu)先級。這樣的代碼可能并不常用，但當(dāng)用戶想在很長的代碼段中進(jìn)行模塊化設(shè)計(jì)或者想避免命名沖突，這是一個不錯的解決辦法。 <br>

　　需要注意的是，盡管下面兩種創(chuàng)建函數(shù)的方法是等價(jià)的： <br>


function funcName(){ <br>
       //函數(shù)體 <br>
} <br>
//等價(jià)于 <br>
var funcName=function(){ <br>
       //函數(shù)體 <br>
} <br>

　　但前面一種方式創(chuàng)建的是有名函數(shù)，而后面是創(chuàng)建了一個無名函數(shù)，只是讓一個變量指向了這個無名函數(shù)。在使用上僅有一點(diǎn)區(qū)別，就是：對于有名函數(shù)，它可以出現(xiàn)在調(diào)用之后再定義；而對于無名函數(shù)，它必須是在調(diào)用之前就已經(jīng)定義。例如： <br>


＜scrīpt language="Javascrīpt" type="text/javascrīpt"＞ <br>
＜!-- <br>
func(); <br>
var func=function(){ <br>
       alert(1) <br>
} <br>
//--＞ <br>
＜/scrīpt＞  <br>

　　這段語句將產(chǎn)生func未定義的錯誤，而： <br>


＜scrīpt language="Javascrīpt" type="text/javascrīpt"＞ <br>
＜!-- <br>
func(); <br>
function func(){ <br>
      alert(1) <br>
} <br>
//--＞ <br>
＜/scrīpt＞ <br>

　　則能夠正確執(zhí)行，下面的語句也能正確執(zhí)行： <br>


＜scrīpt language="Javascrīpt" type="text/javascrīpt"＞ <br>
＜!--  <br>
func(); <br>
var someFunc=function func(){ <br>
      alert(1)  <br>
} <br>
//--＞ <br>
＜/scrīpt＞ <br>

　　由此可見，盡管Javascrīpt是一門解釋型的語言，但它會在函數(shù)調(diào)用時(shí)，檢查整個代碼中是否存在相應(yīng)的函數(shù)定義，這個函數(shù)名只有是通過function funcName()形式定義的才會有效，而不能是匿名函數(shù)。 <br>

　　函數(shù)對象和其他內(nèi)部對象的關(guān)系 <br>

　　除了函數(shù)對象，還有很多內(nèi)部對象，比如：Object、Array、Date、RegExp、Math、Error。這些名稱實(shí)際上表示一個類型，可以通過new操作符返回一個對象。然而函數(shù)對象和其他對象不同，當(dāng)用typeof得到一個函數(shù)對象的類型時(shí)，它仍然會返回字符串 “function”，而typeof一個數(shù)組對象或其他的對象時(shí)，它會返回字符串“object”。下面的代碼示例了typeof不同類型的情況： <br>



alert(typeof(Function))); <br>
alert(typeof(new Function())); <br>
alert(typeof(Array)); <br>
alert(typeof(Object)); <br>
alert(typeof(new Array())); <br>
alert(typeof(new Date())); <br>
alert(typeof(new Object())); <br>

　　運(yùn)行這段代碼可以發(fā)現(xiàn)：前面4條語句都會顯示“function”，而后面3條語句則顯示“object”，可見new一個function實(shí)際上是返回一個函數(shù)。這與其他的對象有很大的不同。其他的類型Array、Object等都會通過new操作符返回一個普通對象。盡管函數(shù)本身也是一個對象，但它與普通的對象還是有區(qū)別的，因?yàn)樗瑫r(shí)也是對象構(gòu)造器，也就是說，可以new一個函數(shù)來返回一個對象，這在前面已經(jīng)介紹。所有typeof返回 “function”的對象都是函數(shù)對象。也稱這樣的對象為構(gòu)造器（constructor），因而，所有的構(gòu)造器都是對象，但不是所有的對象都是構(gòu)造器。 <br>

　　既然函數(shù)本身也是一個對象，它們的類型是function，聯(lián)想到C++、Java等面向?qū)ο笳Z言的類定義，可以猜測到Function類型的作用所在，那就是可以給函數(shù)對象本身定義一些方法和屬性，借助于函數(shù)的prototype對象，可以很方便地修改和擴(kuò)充Function類型的定義，例如下面擴(kuò)展了函數(shù)類型Function，為其增加了method1方法，作用是彈出對話框顯示 "function"： <br>


Function.prototype.method1=function(){ <br>
      alert("function"); <br>
} <br>
function func1(a,b,c){ <br>
      return a+b+c; <br>
} <br>
func1.method1(); <br>
func1.method1.method1(); <br>

　　注意最后一個語句：func1.method1.mehotd1()，它調(diào)用了method1這個函數(shù)對象的method1方法。雖然看上去有點(diǎn)容易混淆，但仔細(xì)觀察一下語法還是很明確的：這是一個遞歸的定義。因?yàn)閙ethod1本身也是一個函數(shù)，所以它同樣具有函數(shù)對象的屬性和方法，所有對 Function類型的方法擴(kuò)充都具有這樣的遞歸性質(zhì)。 <br>

　　Function是所有函數(shù)對象的基礎(chǔ)，而Object則是所有對象（包括函數(shù)對象）的基礎(chǔ)。在Javascrīpt中，任何一個對象都是Object的實(shí)例，因此，可以修改Object這個類型來讓所有的對象具有一些通用的屬性和方法，修改Object類型是通過prototype來完成的： <br>


Object.prototype.getType=function(){ <br>
       return typeof(this); <br>
} <br>
var array1=new Array(); <br>
function func1(a,b){ <br>
      return a+b; <br>
} <br>
alert(array1.getType()); <br>
alert(func1.getType()); <br>

　　上面的代碼為所有的對象添加了getType方法，作用是返回該對象的類型。兩條alert語句分別會顯示“object”和“function”。 <br>

　　將函數(shù)作為參數(shù)傳遞 <br>

　　在前面已經(jīng)介紹了函數(shù)對象本質(zhì)，每個函數(shù)都被表示為一個特殊的對象，可以方便的將其賦值給一個變量，再通過這個變量名進(jìn)行函數(shù)調(diào)用。作為一個變量，它可以以參數(shù)的形式傳遞給另一個函數(shù)，這在前面介紹Javascrīpt事件處理機(jī)制中已經(jīng)看到過這樣的用法，例如下面的程序?qū)unc1作為參數(shù)傳遞給func2： <br>


function func1(theFunc){ <br>
      theFunc(); <br>
} <br>
function func2(){ <br>
      alert("ok"); <br>
} <br>
func1(func2); <br>

　　在最后一條語句中，func2作為一個對象傳遞給了func1的形參theFunc，再由func1內(nèi)部進(jìn)行theFunc的調(diào)用。事實(shí)上，將函數(shù)作為參數(shù)傳遞，或者是將函數(shù)賦值給其他變量是所有事件機(jī)制的基礎(chǔ)。 <br>

　　例如，如果需要在頁面載入時(shí)進(jìn)行一些初始化工作，可以先定義一個init的初始化函數(shù)，再通過window.onload=init;語句將其綁定到頁面載入完成的事件。這里的init就是一個函數(shù)對象，它可以加入window的onload事件列表。 <br>

　　傳遞給函數(shù)的隱含參數(shù)：arguments <br>

　　當(dāng)進(jìn)行函數(shù)調(diào)用時(shí)，除了指定的參數(shù)外，還創(chuàng)建一個隱含的對象——arguments。arguments是一個類似數(shù)組但不是數(shù)組的對象，說它類似是因?yàn)樗哂袛?shù)組一樣的訪問性質(zhì)，可以用arguments[index]這樣的語法取值，擁有數(shù)組長度屬性length。arguments對象存儲的是實(shí)際傳遞給函數(shù)的參數(shù)，而不局限于函數(shù)聲明所定義的參數(shù)列表，例如： <br>


function func(a,b){ <br>
     alert(a); <br>
     alert(b); <br>
     for(var i=0;i＜arguments.length;i++){ <br>
           alert(arguments); <br>
     } <br>
} <br>
func(1,2,3); <br>

　　代碼運(yùn)行時(shí)會依次顯示：1，2，1，2，3。因此，在定義函數(shù)的時(shí)候，即使不指定參數(shù)列表，仍然可以通過arguments引用到所獲得的參數(shù)，這給編程帶來了很大的靈活性。arguments對象的另一個屬性是callee，它表示對函數(shù)對象本身的引用，這有利于實(shí)現(xiàn)無名函數(shù)的遞歸或者保證函數(shù)的封裝性，例如使用遞歸來計(jì)算1到n的自然數(shù)之和： <br>


var sum=function(n){ <br>
      if(1==n)return 1; <br>
      else return n+sum(n-1); <br>
} <br>
alert(sum(100)); <br>

　　其中函數(shù)內(nèi)部包含了對sum自身的調(diào)用，然而對于Javascrīpt來說，函數(shù)名僅僅是一個變量名，在函數(shù)內(nèi)部調(diào)用sum即相當(dāng)于調(diào)用一個全局變量，不能很好的體現(xiàn)出是調(diào)用自身，所以使用arguments.callee屬性會是一個較好的辦法： <br>


var sum=function(n){ <br>
      if(1==n)return 1; <br>
      else return n+arguments.callee(n-1); <br>
} <br>
alert(sum(100)); <br>

　　callee屬性并不是arguments不同于數(shù)組對象的惟一特征，下面的代碼說明了arguments不是由Array類型創(chuàng)建： <br>


Array.prototype.p1=1; <br>
alert(new Array().p1); <br>
function func(){ <br>
       alert(arguments.p1); <br>
} <br>
func(); <br>

　　運(yùn)行代碼可以發(fā)現(xiàn)，第一個alert語句顯示為1，即表示數(shù)組對象擁有屬性p1，而func調(diào)用則顯示為“undefined”，即p1不是arguments的屬性，由此可見，arguments并不是一個數(shù)組對象。  <br>


　　函數(shù)的apply、call方法和length屬性 <br>

　　Javascrīpt為函數(shù)對象定義了兩個方法：apply和call，它們的作用都是將函數(shù)綁定到另外一個對象上去運(yùn)行，兩者僅在定義參數(shù)的方式有所區(qū)別： <br>



Function.prototype.apply(thisArg,argArray); <br>
Function.prototype.call(thisArg[,arg1[,arg2…]]); <br>

　　從函數(shù)原型可以看到，第一個參數(shù)都被取名為thisArg，即所有函數(shù)內(nèi)部的this指針都會被賦值為thisArg，這就實(shí)現(xiàn)了將函數(shù)作為另外一個對象的方法運(yùn)行的目的。兩個方法除了thisArg參數(shù)，都是為Function對象傳遞的參數(shù)。下面的代碼說明了apply和call方法的工作方式： <br>


//定義一個函數(shù)func1，具有屬性p和方法A <br>
function func1(){ <br>
      this.p="func1-"; <br>
      this.A=function(arg){ <br>
            alert(this.p+arg);  <br>
      } <br>
} <br>
//定義一個函數(shù)func2，具有屬性p和方法B <br>
function func2(){ <br>
      this.p="func2-"; <br>
      this.B=function(arg){ <br>
             alert(this.p+arg); <br> 
      } <br>
} <br>
var obj1=new func1(); <br>
var obj2=new func2(); <br>
obj1.A("byA");    //顯示func1-byA <br>
obj2.B("byB");    //顯示func2-byB <br>
obj1.A.apply(obj2,["byA"]); //顯示func2-byA，其中[“byA”]是僅有一個元素的數(shù)組，下同 <br>
obj2.B.apply(obj1,["byB"]); //顯示func1-byB <br>
obj1.A.call(obj2,"byA");  //顯示func2-byA <br>
obj2.B.call(obj1,"byB");  //顯示func1-byB <br>

　　可以看出，obj1的方法A被綁定到obj2運(yùn)行后，整個函數(shù)A的運(yùn)行環(huán)境就轉(zhuǎn)移到了obj2，即this指針指向了obj2。同樣obj2的函數(shù)B也可以綁定到obj1對象去運(yùn)行。代碼的最后4行顯示了apply和call函數(shù)參數(shù)形式的區(qū)別。 <br>

　　與arguments的length屬性不同，函數(shù)對象還有一個屬性length，它表示函數(shù)定義時(shí)所指定參數(shù)的個數(shù)，而非調(diào)用時(shí)實(shí)際傳遞的參數(shù)個數(shù)。例如下面的代碼將顯示2： <br>


function sum(a,b){ <br>
      return a+b; <br>
} <br>
alert(sum.length); <br>

　　深入認(rèn)識Javascrīpt中的this指針 <br>

　　this指針是面向?qū)ο蟪绦蛟O(shè)計(jì)中的一項(xiàng)重要概念，它表示當(dāng)前運(yùn)行的對象。在實(shí)現(xiàn)對象的方法時(shí)，可以使用this指針來獲得該對象自身的引用。 <br>

　　和其他面向?qū)ο蟮恼Z言不同，Javascrīpt中的this指針是一個動態(tài)的變量，一個方法內(nèi)的this指針并不是始終指向定義該方法的對象的，在上一節(jié)講函數(shù)的apply和call方法時(shí)已經(jīng)有過這樣的例子。為了方便理解，再來看下面的例子： <br>


＜scrīpt language="Javascrīpt" type="text/javascrīpt"＞ <br>
＜!-- <br>
//創(chuàng)建兩個空對象 <br>
var obj1=new Object(); <br>
var obj2=new Object(); <br>
//給兩個對象都添加屬性p，并分別等于1和2 <br>
obj1.p=1; <br>
obj2.p=2; <br>
//給obj1添加方法，用于顯示p的值 <br>
obj1.getP=function(){ <br>
      alert(this.p); //表面上this指針指向的是obj1 <br>
} <br>
//調(diào)用obj1的getP方法 <br>
obj1.getP(); <br>
//使obj2的getP方法等于obj1的getP方法 <br>
obj2.getP=obj1.getP; <br>
//調(diào)用obj2的getP方法 <br>
obj2.getP(); <br>
//--＞ <br>
＜/scrīpt＞ <br>

　　從代碼的執(zhí)行結(jié)果看，分別彈出對話框顯示1和2。由此可見，getP函數(shù)僅定義了一次，在不同的場合運(yùn)行，顯示了不同的運(yùn)行結(jié)果，這是有 this指針的變化所決定的。在obj1的getP方法中，this就指向了obj1對象，而在obj2的getP方法中，this就指向了obj2對象，并通過this指針引用到了兩個對象都具有的屬性p。 <br>

　　由此可見，Javascrīpt中的this指針是一個動態(tài)變化的變量，它表明了當(dāng)前運(yùn)行該函數(shù)的對象。由this指針的性質(zhì)，也可以更好的理解Javascrīpt中對象的本質(zhì)：一個對象就是由一個或多個屬性（方法）組成的集合。每個集合元素不是僅能屬于一個集合，而是可以動態(tài)的屬于多個集合。這樣，一個方法（集合元素）由誰調(diào)用，this指針就指向誰。實(shí)際上，前面介紹的apply方法和call方法都是通過強(qiáng)制改變this指針的值來實(shí)現(xiàn)的，使this指針指向參數(shù)所指定的對象，從而達(dá)到將一個對象的方法作為另一個對象的方法運(yùn)行。<br>

　　每個對象集合的元素（即屬性或方法）也是一個獨(dú)立的部分，全局函數(shù)和作為一個對象方法定義的函數(shù)之間沒有任何區(qū)別，因?yàn)榭梢园讶趾瘮?shù)和變量看作為window對象的方法和屬性。也可以使用new操作符來操作一個對象的方法來返回一個對象，這樣一個對象的方法也就可以定義為類的形式，其中的 this指針則會指向新創(chuàng)建的對象。在后面可以看到，這時(shí)對象名可以起到一個命名空間的作用，這是使用Javascrīpt進(jìn)行面向?qū)ο蟪绦蛟O(shè)計(jì)的一個技巧。例如： <br>


var namespace1=new Object();  <br>
namespace1.class1=function(){  <br>
     //初始化對象的代碼 <br>
}
var obj1=new namespace1.class1(); <br>

　　這里就可以把namespace1看成一個命名空間。 <br>

　　由于對象屬性（方法）的動態(tài)變化特性，一個對象的兩個屬性（方法）之間的互相引用，必須要通過this指針，而其他語言中，this關(guān)鍵字是可以省略的。如上面的例子中： <br>


obj1.getP=function(){ <br>
      alert(this.p); //表面上this指針指向的是obj1 <br>
} <br>

　　這里的this關(guān)鍵字是不可省略的，即不能寫成alert(p)的形式。這將使得getP函數(shù)去引用上下文環(huán)境中的p變量，而不是obj1的屬性。  <br>

[[category:PHP教程]]