Function作為Javascript的核心技術之一,清晰的理解function的機制和用法,對我們進行javascript開發非常重要.今天本人就結合自己的實踐為大家介紹一些function在javascript中的一些淺顯用法.

1. Function是什么

從Javascript對function的定義, function是一個由代碼集合而成的對象.

從中我們可看出,我們可以使用向C語言中的函數那樣使用function,也可以對function進行面向對象編程.當然Javascript中function的強

大還不止如此.

2. 如何使用function

2.1定義

function myfunc(param) {  
    //code  
} 

注意Javascript中的這兩個function被認為是同一個:

在運行時到底調用哪一個function取決于加載順序,后一個加載的function會覆蓋前一個.

function func1() {return 'func1'; }  
function func1(name) { return name; } 

換句話說就是,function的參數都是可選參數,因此funciton的識別是不包括如參的,而函數入參處的聲明是為了引用方便以及可讀性.

以上的代碼也等價于:

function func1() {  
    return arguments[0] || 'func1';  
}  
func();              //return 'func1'  
func('function'); //return 'function' 

2.2 function當作對象

是的沒錯,在javascript中function就是對象,我們可以向使用一個對象那樣使用function.

它可以有自己的屬性和方法.有如下的一個funciton:

function nameOf(name) {  
    return name.toUpperCase();   
} 

2.2.1 function作為對象進行賦值

var person = person || {};  
person.nameOf = nameOf;  
person.nameOf('yang dong') // return "YANG DONG" 

2.2.2 定義function的屬性

看看以下的代碼, 你能從中的到什么信息:

function nameOf() {return nameOf.blogger;}  
nameOf.blogger = "YANG_DONG"; 

沒錯,function可以擁有自己的屬性.

考慮這樣一種場景, 假如我們要統計某個function被調用的次數.那么我們有兩種方式來實現:

1.設定一個全局變量來記錄,該funciton被調用的次數,每調用一次,該變量加1:

var globalNameOfCounter = 0;  
nameOf();  
globalNameOfCounter ++; 

這樣做看起來是沒有問題的,在代碼還是比較簡單的時候,它可以工作的很好,但是隨著代碼越來越復雜,維護這段邏輯的成本會直線上升.

主要是因為:globalNameOfCounter污染的global命名空間,并且破壞了代碼的封裝性.

2.使用function的屬性

看看以下代碼:

function nameOf() {  
    nameOf.counter++;  
    return nameOf.blogger;  
}  
nameOf.blogger = “YANG_DONG"  
nameOf.counter = 0;    
nameOf(); //nameOf.counter = 1  
nameOf(); //nameOf.counter = 2 

顯而易見,第二種方式有著很好的封裝性和維護性.function的屬性的應用還不止如此.請看下文.

2.3 function作為名字空間

Javascript不支持名字空間(本人不太理解如此強大的語言為什么不支持名字空間呢,這是為什么呢?),

不過我們依然可以使用其強大的funciton為我們支持名字空間.

從上節我們知道function可以定義自己的屬性,我們就可以利用該特性來生成名字空間.請看以下代碼:

nameOf.getBloggerName = function() {  
    return nameOf.blogger;  
} 

此時在nameOf名字空間之下已經包含了:blogger,counter屬性和function getBloggerName.

2.4 function作為method

在javascript中function和method其實是沒有什么本質區別的,如果非的區分兩者的話,我想也就是this變量不同吧.

function g() {return this;}  
var local = local || {};  
local.method = g; //修改this指向local  
local.method();   //返回local對象  
g();              //返回DOMWindow對象 

2.5 function皆為closure

在Javascript中所有的function都綁定了一個scope chain,因此它是一個保存了調用上下文的函數.看看下面的實例代碼:

var variable = 'global';  
function getVariable(){  
    var variable = 'local',  
    func = function() {  
        return variable;  
    };  
    return func;  
}  
getVariable()();  //return local; 

當func被調用的時候,它所取的varible的值是調用上下文中的變量而并非與之同名的全局變量.

3. 總結

如果用一句話概括今天對funciton的介紹,那么我想應該是: function是可以被調用執行的代碼集對象.

以上是function的一些應用場景,當然它還不止這些.

比如: function作為構造函數(也就是funciton作為類),繼承等.

原文：http://www.cnblogs.com/yangdong/archive/2012/02/05/function-in-javascript-0.html

【編輯推薦】

1. JavaScript面向對象編程
2. JavaScript中的陷阱大集合
3. 深入理解JavaScript之強大的原型和原型鏈
4. 使用JavaScript和Canvas寫一個游戲框架
5. 20個將JavaScript推到***的網站