你了解JavaScript中的function嗎?
Function作為Javascript的核心技術(shù)之一,清晰的理解function的機(jī)制和用法,對(duì)我們進(jìn)行javascript開發(fā)非常重要.今天本人就結(jié)合自己的實(shí)踐為大家介紹一些function在javascript中的一些淺顯用法.
1. Function是什么
從Javascript對(duì)function的定義, function是一個(gè)由代碼集合而成的對(duì)象.
從中我們可看出,我們可以使用向C語(yǔ)言中的函數(shù)那樣使用function,也可以對(duì)function進(jìn)行面向?qū)ο缶幊?當(dāng)然Javascript中function的強(qiáng)
大還不止如此.
2. 如何使用function
2.1定義
- function myfunc(param) {
- //code
- }
注意Javascript中的這兩個(gè)function被認(rèn)為是同一個(gè):
在運(yùn)行時(shí)到底調(diào)用哪一個(gè)function取決于加載順序,后一個(gè)加載的function會(huì)覆蓋前一個(gè).
- function func1() {return 'func1'; }
- function func1(name) { return name; }
換句話說就是,function的參數(shù)都是可選參數(shù),因此funciton的識(shí)別是不包括如參的,而函數(shù)入?yún)⑻幍穆暶魇菫榱艘梅奖阋约翱勺x性.
以上的代碼也等價(jià)于:
- function func1() {
- return arguments[0] || 'func1';
- }
- func(); //return 'func1'
- func('function'); //return 'function'
2.2 function當(dāng)作對(duì)象
是的沒錯(cuò),在javascript中function就是對(duì)象,我們可以向使用一個(gè)對(duì)象那樣使用function.
它可以有自己的屬性和方法.有如下的一個(gè)funciton:
- function nameOf(name) {
- return name.toUpperCase();
- }
2.2.1 function作為對(duì)象進(jìn)行賦值
- 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";
沒錯(cuò),function可以擁有自己的屬性.
考慮這樣一種場(chǎng)景, 假如我們要統(tǒng)計(jì)某個(gè)function被調(diào)用的次數(shù).那么我們有兩種方式來實(shí)現(xiàn):
1.設(shè)定一個(gè)全局變量來記錄,該funciton被調(diào)用的次數(shù),每調(diào)用一次,該變量加1:
- var globalNameOfCounter = 0;
- nameOf();
- globalNameOfCounter ++;
這樣做看起來是沒有問題的,在代碼還是比較簡(jiǎn)單的時(shí)候,它可以工作的很好,但是隨著代碼越來越復(fù)雜,維護(hù)這段邏輯的成本會(huì)直線上升.
主要是因?yàn)?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
顯而易見,第二種方式有著很好的封裝性和維護(hù)性.function的屬性的應(yīng)用還不止如此.請(qǐng)看下文.
2.3 function作為名字空間
Javascript不支持名字空間(本人不太理解如此強(qiáng)大的語(yǔ)言為什么不支持名字空間呢,這是為什么呢?),
不過我們依然可以使用其強(qiáng)大的funciton為我們支持名字空間.
從上節(jié)我們知道function可以定義自己的屬性,我們就可以利用該特性來生成名字空間.請(qǐng)看以下代碼:
- nameOf.getBloggerName = function() {
- return nameOf.blogger;
- }
此時(shí)在nameOf名字空間之下已經(jīng)包含了:blogger,counter屬性和function getBloggerName.
2.4 function作為method
在javascript中function和method其實(shí)是沒有什么本質(zhì)區(qū)別的,如果非的區(qū)分兩者的話,我想也就是this變量不同吧.
- function g() {return this;}
- var local = local || {};
- local.method = g; //修改this指向local
- local.method(); //返回local對(duì)象
- g(); //返回DOMWindow對(duì)象
2.5 function皆為closure
在Javascript中所有的function都綁定了一個(gè)scope chain,因此它是一個(gè)保存了調(diào)用上下文的函數(shù).看看下面的實(shí)例代碼:
- var variable = 'global';
- function getVariable(){
- var variable = 'local',
- func = function() {
- return variable;
- };
- return func;
- }
- getVariable()(); //return local;
當(dāng)func被調(diào)用的時(shí)候,它所取的varible的值是調(diào)用上下文中的變量而并非與之同名的全局變量.
3. 總結(jié)
如果用一句話概括今天對(duì)funciton的介紹,那么我想應(yīng)該是: function是可以被調(diào)用執(zhí)行的代碼集對(duì)象.
以上是function的一些應(yīng)用場(chǎng)景,當(dāng)然它還不止這些.
比如: function作為構(gòu)造函數(shù)(也就是funciton作為類),繼承等.
原文:http://www.cnblogs.com/yangdong/archive/2012/02/05/function-in-javascript-0.html
【編輯推薦】