欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

javascript 面向對象編程 function也是類

 更新時間:2009年09月17日 23:20:15   作者:  
function在javascript中用來創(chuàng)建函數或方法,但要想實現面向對象方式的編程,類是不可或缺的角色之一,而且是主角。
但javascript中并沒有類概念,所謂的類也是模擬而來,通過函數加閉包模擬出類成員及私有成員(關于閉包可以參見跨越邊界: 閉包)。這里我們將用比較平實的方式來了解一下javascript中的”類”,避開一些生硬的原理。

      既然是用function來模擬類,所以編寫代碼創(chuàng)建類的關鍵字還是function。我們創(chuàng)建一個座標點類。

    function Point() {
      this.X = 0;
      this.Y = 0;
    };
 
    var zeroPoint = new Point();
    alert("當前座標值( X:" + zeroPoint.X + " , Y:" + zeroPoint.Y + " )");

        image

      大家都知道非靜態(tài)類成員的訪問需要通過對象來完成,所以先new出了一個Point類型對象,再通過該對象完成X和Y軸座標值的訪問。從語法上來說,javascript類對象的創(chuàng)建過程和C#等差不多,但實現機制卻不相同。這里的new創(chuàng)建出了一個Object,后續(xù)的Point()函數執(zhí)行時將其this指向了這個新的Object對象。Point中的this.X和this.Y是Point類的兩個公共成員,所以Point的對象可以直接對它們進行訪問。

      說到類成員或對象的成員,免不了要提到可訪問性的問題。在javascript的類中,也有public成員和private成員之分,但究其細節(jié)卻不盡相同。javascript私有成員也是些在類外部不可以通過對象進行操作的成員,其實在類的內部成員之間私有成員也不定能被訪問。在類的內部一般只有私有成員和私有成員之間可以互相的訪問,你可以認為其它成員權限不夠不能操作這些隱私的東西,但如果你有特權,那就不一樣了,管它私有公開照用不誤。私有成員變量和普通變量聲明一樣,用var關鍵字,私有方法可以用var聲明變量來接收方法對象,也可以像普通方法那樣去構建。

    function Lady() {
      var age = 30;
      var name = "菜花";
 
      var think = function() {
        alert("其實我今年" + age + "歲。");
      };
      
      function fancy(){
        alert("幻想變成20歲。");
      };
 
      this.Introduce = function() {
        alert("我叫" + name + " , 今年20歲。");
      };
    };
 
    var younglady = new Lady();
    alert(younglady.age);//結果undefined
    younglady.think(); //不支持
    younglady.fancy(); //不支持

      上面是一個Lady類,age、think、fancy都是私有成員,think和fancy方法可以訪問age和name,think和fancy兩個方法也可以互相進行調用。但它們是私有的,所以創(chuàng)建出來的youngLady對象并不能調用到age、think和fancy,當然也不能調用到name。如果私有成員只能互相之間調用,其實也就失去了私有成員存在的意義。javascript提供特權成員可以建立外界和私有成員互通的橋梁。特權成員是公共成員的一種,公共成員有普通公共成員、特權成員和對象公共成員。

      特權成員就是在類中用this.XX的方式建立的成員,它們可以通過對象來被調用,它們也可以訪問私有成員,可以建立私有成員被訪問的通道。

    function Lady() {
      var age = 30;
      this.Name = "菜花";
 
      var think = function() {
        alert("其實我今年" + age + "歲。");
      };
 
      function fancy() {
        alert("幻想變成20歲。");
      };
 
      this.Introduce = function() {
        alert("我叫" + this.Name + " , 今年" + age + "歲。");
      };
    };
 
    var younglady = new Lady();
    younglady.Introduce(); //Introduce

        image

      普通公共成員的創(chuàng)建,不在類的里面來編碼,而是通過類的prototype來創(chuàng)建。添加普通公共成員都直接添加到類的prototype中,而prototype就是一個像JSON對象一樣的成員集對象。當我們進行對象創(chuàng)建時,可以認為會將類prototype中的成員整體copy入新的Object對象中。

    var younglady = new Lady();
    younglady.Introduce(); //Introduce
 
    Lady.prototype.Hobby = "上網";
    Lady.prototype.GetName = function() {
      return this.Name;
    };
    
    var lady2 = new Lady();
    alert(lady2.GetName());
    alert(lady2.Hobby);

      上面代碼通過prototype為Lady類添加了普通公共成員GetName方法和Hobby屬性,因為是公共成員,所以它們可以和原先定意在類中的特權成員進行互相訪問。因為公共成員可以互相訪問。對上述代碼做些修改。如下。

    var younglady = new Lady();
 
    Lady.prototype.Hobby = "上網";
    Lady.prototype.GetName = function() {
      return this.Name;
    };
 
    alert(younglady.GetName());
    alert(younglady.Hobby);

      先創(chuàng)建出Lady對象,再修改類成員,先前創(chuàng)建好的對象也具有了新的成員。這就是prototype做為類原型所帶來的好處,這里簡單理解,可以認為prototype是類對象的模版,模版的修改會影響到所有該類對象。

      在添加普通成員的時候也可以來個批量的添加,直接用一個新的JSON對象來賦給prototype就可以了。但是要注意,現在是將原先的prototype進行了替換,在替換之前創(chuàng)建的對象引用的是舊的prototype對象,所以對prototype替換之前創(chuàng)建的對象不會有Hobby和GetName成員。

    Lady.prototype = {
      Hobby: "上網",
      GetName: function() {
        return this.Name;
      }
    };
    var younglady = new Lady();
    alert(younglady.GetName());
    alert(younglady.Hobby);

      除了在構建類時可以添加公共成員,還可以對對象直接進行成員操作。這在本小系列第二篇文章里有描述。這里做一下補充,對對象直接添加的成員,也是一種公共成員,這些成員也可以和類中原先具有的公共成員進行訪問。

    younglady.SetName = function(name) {
      this.Name = name;
    };
    younglady.SetName("菜明");
    alert(younglady.GetName());

以上說了一下類成員的東西,下次再說說類繼承相關的東西。(如有不當說法請指正)

相關文章

  • 改變javascript函數內部this指針指向的三種方法

    改變javascript函數內部this指針指向的三種方法

    javascript 的this 值,真的是非常的莫名奇妙。我一直被搞的很頭暈,也許正是這個this,讓大多數人感覺js 非常的莫名其妙。
    2010-04-04
  • 學習面向對象之面向對象的術語

    學習面向對象之面向對象的術語

    學習面向對象之面向對象的術語,學習面向對象設計的朋友可以參考下。
    2010-11-11
  • javascript對象小結

    javascript對象小結

    這次主要測試了幾個主要的對象,包括string,date,數組。用date對象做了個類似倒計時的功能,呵呵
    2010-07-07
  • javascript new fun的執(zhí)行過程

    javascript new fun的執(zhí)行過程

    new fun的執(zhí)行過程分析,學習面向對象的朋友可以參考下。
    2010-08-08
  • JavaScript定義類或函數的幾種方式小結

    JavaScript定義類或函數的幾種方式小結

    js中不論是定義類或者函數,很多朋友想將代碼寫的更專業(yè),更方便擴展等,那么就可以參考這篇文章了,最好是總結,建議大家收藏下。
    2011-01-01
  • JavaScript對象鏈式操作代碼(jquery)

    JavaScript對象鏈式操作代碼(jquery)

    自從使用了jQuery以后,對它的鏈式操作很是依賴,以至于常常覺得其他庫不好用。。
    2010-07-07
  • JS繼承 筆記

    JS繼承 筆記

    JavaScript中沒有類的概念,與類相關的繼承的概念更是無從談起,但是我們可以通過特殊的語法來模擬面向對象語言中的繼承。
    2011-07-07
  • Javascript面向對象編程

    Javascript面向對象編程

    Javascript是一種面向(基于)對象的動態(tài)腳本語言,是一種基于對象(Object)和事件驅動(EventDriven)并具有安全性能的腳本語言。他具有面向對象語言所特有的各種特性,比如封裝、繼承及多態(tài)等
    2012-03-03
  • 老魚 淺談javascript面向對象編程

    老魚 淺談javascript面向對象編程

    這周心血來潮,翻看了現在比較流行的幾個JS腳本框架的底層代碼,雖然是走馬觀花,但也受益良多,感嘆先人們的偉大……
    2010-03-03
  • JavaScript 構造函數 面相對象學習必備知識

    JavaScript 構造函數 面相對象學習必備知識

    關于JavaScript構造函數,如今出現了很多JavaScript的框架,例如jQuery、Ext等等這些,這些將JavaScript作為一種面向對象的語言進行編程,那么JavaScript到底是怎么樣實現面向對象的一些特征的呢,首先,我們來看看JavaScript怎么樣來定義一個構造函數。
    2010-06-06

最新評論