自訂物件

Javascript的自訂物件:

Javascript並沒有一般物件導向語言所擁有的類別,但是他依然能藉由建構函式來重複建立物件。身為一個業餘的Javascript愛好者,我個人覺得這很特別,函式本身就是物件,然後我們用物件來建立物件,嘿嘿。而事實上建構函式與利用建構函式建立的物件關係很微妙。會這樣說是因為建構函式跟建立出來的物件可以算是完全不同的物件。但是物件的繼承其實是由建構函式的prototype屬性來完成,當然,在這裡先把這議題先留置,我們還是回到自訂物件本身的做法。

利用建構函式建立物件:

函式是個物件,但他也可以用來當作建構函式來建立其他物件。我們在函式中使用this來代表物件,然後為其新增屬性與方法,然後再用new關鍵字來實作這物件。看看下面這例子建立一個關於Player的建構函式:

<script type="text/javascript">
function Player(name,race,sex) {
  this.name = name.toString();
  this.race = race.toString();
  this.sex = sex.toString();
  this.getName = function() {
    return this.name;
  };
  this.getRace = function() {
    return this.race;
  };
  this.getSex = function() {
    return this.sex;
  };
}
var playerA=new Player("維克","人類","男性");
document.writeln("姓名:"+playerA.getName()+" 種族:"+playerA.getRace()+" 性別:"+playerA.getSex());
//輸出姓名==>維克 種族:人類 性別:男性 
</script>

這小程式建立了一個Player建構函式,然後我們就可以用他來重複的建立player物件,像是範例中的playerA。必須說明這種方法可行但不是一種好方法,因為物件屬性沒有進行封裝,物件方法也沒有使用到原型的優點。不過這確實是一個簡易的入門方式。

簡易的一次性物件:

如果物件不需要重複的實體化,那可以試試這種簡易的物件定義方式:

<script type="text/javascript">
var player={ 
  name:"維克",
  age:10,
  getName:function(){
    return this.name;},
  getAge:function(){
    return this.age;},
}
player.race="人類";//也可以這樣為物件新增屬性或方法
document.writeln("姓名:"+player.getName());
//輸出==>姓名:維克 
</script>

{ }左右大括號把物件包裹起來,:(冒號)左邊是物件的屬性或方法,右邊是賦予他的值。從上例來說,player物件有個叫做name的屬性,他的值是"維克"。有個getName()方法會傳回this.name。物件也可以直接添加屬性與方法,就像 player.race="人類"; 這行程式碼為player物件添加了一個race屬性,並指定其值為"人類"。

也可以直接使用var player=new Object(),然後在為其添加屬性與方法,跟上例相同,就不再多說,而且此方法太過累贅,不建議使用。

 
 

  按個讚!~支持本站!~

FB推薦載入中