JavaScript面向對象
由于js語言本身語法的靈活性,使得在js程序中出現了各種各樣的代碼風格,但也因為如此,導致了代碼的可讀性和可維護性大大降低,特別隨著項目的不斷更新,js代碼的不斷更新,到后期時甚至連自己的代碼都不知然了,因此確定一種好的代碼風格是很有必要的。
近些年隨著ajax的興起,js變得越來越受重視,js開始在web開發中充當非常重要的角色,因此也開始遇到了各種各樣的問題,于是很多大牛就提出了js的面向對象編程方法。
JavaScript是一種基于原型(prototype)的面向對象的語言,它沒有類的概念,所有的一切都派生自現有對象的一個副本。
一、下面看我畫的總結圖:
二、難點解析
1、this的概念
this管家你在引用的是包含它的函數作為某個對象的方法被調用時的那個對象。 下面看下面一個小例子:
<script type="text/javascript"> var sound="admin"; function myFunction(){ this.style.color='red'; alert(sound); } </script> <body> <a href="#" id="a">這是測試用的超鏈接</a> <script type="text/javascript"> document.getElementById("a").onclick=myFunction; </script> </doby>
根據this的定義我們知道,上例中的this代表的是超鏈接。
2、構造函數的創建
Function是創建構造函數的起點。我們在之前學習C#的時候就已經學過,在創建函數實例的時候,我們也能創建構造函數。在js中也一樣,例如編寫代碼:
var myObject=new myConstructor();
此時,myConstructor函數也可以作為構造函數。當對象被實例之后,構造函數會執行包含的代碼。
3、閉包
閉包其實非常好理解,它的含義就類似于我們所學習的全局變量和局部變量。閉包是將函數內部和函數外部連接起來的一座橋梁。
下面看一個例子,詳見注釋:
<script type="text/javascript" language="javascript"> function override(){ //自定義alert函數 var alert=function(message){ window.alert('override'+message); }; alert('alert');//調用自定義的alert函數。 window.alert('window.alert');//調用window內置函數alert } override();//調用函數,執行函數內部的方法 alert('alert from outside');//調用window函數的alert(這里由于閉包的原因,看不到用于自定義的alert函數) </script>
閉包的作用:一是可以讀取函數內部的變量,另一個是讓這些變量的值始終保持在內存中。怎樣理解這句話呢?下面再來看一段代碼:
<script type="text/javascript"> function funOne(){ var n=999; nAdd=function(){ n+=1; } function funTwo(){ alert(n); } return funTwo; } var result=funOne(); result();//999 nAdd(); result(); //1000 </script>
在這段代碼中,result實際上就是閉包funTwo函數。它一共運行了兩次,第一次的值是999,第二次的值是1000。這證明了funOne中的局部變量n一直保存在內存中,并沒有在funOne調用后被自動清除。
為什么會這樣呢?因為funOne是funTwo的父函數,而funTwo被賦給了一個全局變量,這導致funTwo始終在內存中,而funTwo的存在依賴于funOne,因此funOne也始終在內存中,不會在調用結束后,被垃圾回收機制——garbage collection回收。
“nAdd=function(){n+=1}”一行代碼中,首先在nAdd前面沒有使用var關鍵字,因此nAdd是一個全局變量,而不是局部變量。其次,nAdd的值是一個匿名函數——anonmous function,而這個匿名函數本身也是一個閉包,所以nAdd相當于一個setter,可以在函數外部對函數內部的局部變量進行操作。
三、總結
js面向對象部分的總結就到這里了。很多地方,本人理解的也不是很到位,希望您提出寶貴意見。本博客之前,推出過關于js面向對象的小例子,如果有興趣的話,您可以自行查看。
轉自:http://blog.csdn.net/liu765023051/article/details/7669040