JavaScript Function函數類型介紹

 // 在JS中,Function(函數)類型實際上是對象;每個函數都是Function類型的實例;而且都與其他引用類型一樣具有屬性和方法;

// 由於函數是對象,因此函數名實際上也是一個指向函數對象的指針;

一 函數的聲明方式

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 1.函數聲明方式 function box(num1,num2){ return num1+num2; }   2.函數表達式定義函數 var box = function(num1,num2){　　// 通過變量box即可引用函數; return num1+num2; };　　　　　　　　　　　　　　　　　　// 注意函數末尾有一個分號,就像聲明其他變量時一樣; 　　var another = box;　　　　　　　　　// 使用不帶圓括號的函數名是訪問函數指針;而非調用函數; 　　　　console.log(another(10,10));　　 3.使用Function構造函數 var box = new Function('num1','num2','return num1+num2'); // 第三種方式不推薦,這種語法會導致解析兩次代碼(第一次解析常規JS代碼,第二次解析傳入構造函數中的字符串),從而影響性能; // 可以通過這種語法來理解"函數是對象,函數名是指針"的概念;

二 作為值的函數

1 2 3 4 5 6 7 8 9 10 11 // JS中的函數名本身就是變量,所以函數也可以作為值來使用; // 也就是說,不僅可以像傳參數一樣把一個函數傳遞給另一個函數,而且可以將一個函數作為另一個函數的結果返回; function box(sumFunction,num){　　　　// 無論第一個參數傳遞進來的是什麼函數, return sumFunction(num);　　　　　// 它都會返回執行第一參數後的結果; } function sum(num){ return num+10; } // 傳遞函數到另一個函數裡; 　　　　// 要訪問函數的指針不執行函數的話,須去掉函數名後的圓括號; var result = box(sum,10); // =>20;

三 函數內部屬性

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 // 函數內部有兩個特殊的對象:arguments和this;   // 1.arguments:是一個類數組對象,包含著傳入函數中的所有參數,主要用途是保存函數參數; // arguments這個對象還有一個名叫callee的屬性,該屬性是一個指針,指向擁有這個arguments對象的函數; function box(num){ if(num<=1){ return 1; }else{ return num*arguments.callee(num-1); // 使用arguments.callee來執行box本身; } }   // 2.this:引用的是函數據以操作的對象,或者說函數調用語句所處的作用域; // 當在全局作用域調用函數時,this對象引用的就是window; window.color = "red"; alert(this.color); // 打印全局的color;=>red; var box = { color:'blue', sayColor:function(){ alert(this.color); // 打印局部的color;=>blue; } };

四 函數屬性和方法

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 // JS中的函數是對象,因此函數也有屬性和方法;包含length和prototype;   // length屬性:表示函數希望接收到命名參數的個數; function box(name,age){ alert(name+age); } alert(box.length); // 2s   // prototype屬性:它是保存所有實例方法的真正所在,也就是原型; // prototype包含兩個方法:apply()和call(),每個函數都包含這兩個非繼承而來的方法; // 這兩個方法的用途都在特定的作用域中調用函數,實際上等於設置函數體內this對象的值; var color = 'red'; var box = { color = 'blue'; } function sayColor({ alert(this.color); }); sayColor(); // 作用域在window; sayColor.call(this); // 作用域在window; sayColor.call(window); // 作用域在window; sayColor.call(box); // 作用域在box,對象冒充;=>red; // 使用call(box)方法的時候,sayColor()方法的運行環境已經變成了box對象裡了; // 使用call()或apply()來擴充作用域的最大好處,就是對象不需要與方法發生任何耦合關系; // 耦合:相互關聯的意思,擴展和維護會發生連鎖反應; // 也就是說,box對象和sayColor()方法之間不會有多余的關聯操作,比如:box.sayColor = sayColor;   function Animal(){ this.name = "Animal"; this.showName = function(){ alert(this.name); } } function Cat(){ this.name = "Cat"; } var animal = new Animal(); var cat = new Cat(); //通過call或apply方法，將原本屬於Animal對象的showName()方法交給對象cat來使用。 //輸入結果為"Cat" animal.showName.call(cat,","); //animal.showName.apply(cat,[]);

五 小結
1 // 函數實際上是Function類型的實例,因此函數也是對象;而這一點正式JavaScript最有特色的地方;
2 // 由於函數對象,所以函數也擁有方法,可以用來增強其行為;