1. 程式人生 > >JavaScript面向對象總結

JavaScript面向對象總結

str bject cnblogs ont function blob 明顯 eat ase

  對象(Object)應該算是js中最為重要的部分,也是js中非常難懂晦澀的一部分。更是面試以及框架設計中各出沒。本文章,主要參考JavaScript紅寶書(JavaScript高級程序設計 第六章)以及各大博主博客

談談對象屬性的特性

  畢竟是面向對象編程,我們在討論如何面向對象之前先討論討論對象具有哪些屬性和特性。

屬性類型

  簡單的說,對象擁有四個屬性:

  • [[Configurable]]:是否可以通過delete刪除,能否修改屬性的特性。直白點:是否可配置
  • [[Enumerable]]:枚舉性,表示是否可以通過for-in循環返回
  • [[Writable]]:可寫性:是否可以修改屬性的值
  • [[Value]]:包含屬性的值,也就是對應的可讀性。 以上四個對象的屬性的屬性類型默認值分別為:true,true,true,undefined。

  如果要修改屬性默認的特性,必須通過Object.defineProperty()方法。大致如下:

var animal = {};
Object.defineProperty(animal,"name",{
    writable:false,
    value: dog
});
console.log(animal.name);//dog
animal.name = cat;
console.log(animal.name);
//dog

  writable:false,表示不可更改屬性的值。從上面的實例可以看出,在調用Object.defineProperty()方法後,如果不指定 configurable、enumerable、writable 特性的值時,默認為FALSE。

訪問器屬性

  訪問器屬性不包含數據值,但是包含getter和setter函數。在讀取訪問器屬性時,會調用getter函數,這個函數負責返回有效值。在寫入訪問器屬性時,回到用setter函數並傳入新值。

  • [[Configurable]]:表示是否可以通過delete刪除。默認為TRUE
  • [[Enumerable]]:同上面介紹的Enumerable一樣,默認為true
  • [[Get]]:讀取數據時候調用的方法。默認為undefined
  • [[Set]]:在寫入屬性值得時候默認調用的方法。默認為undefined

  這裏不做過多解釋,直接看例子吧(來自js紅寶書)

var book = {
    _year:2012,
    edition:1
};
Object.defineProperty(book, year,{
    get:function(){
        return this._year
    },
    set:function(value){
        if(value>2012){
            this._year = value,
            this.edition++
        }
    }
});

book.year = 2013;
console.log(book.edition);//2

  其實對於多個屬性的定義,我們可以使用Object.defineProperties方法。然後對於讀取屬性的特性我們可以使用Object.getOwnPropertyDescriptor()方法。

創建對象

  創建對象,我們不是直接可以通過Object的構造函數或者對象字面量的方法來實現對象的創建嘛?當然,這些方法是可以的,但是有一個明顯的缺點:使用同一個接口創建很多對象,產生大量重復的代碼。所以這裏,我們使用如下的一些操作

工廠模式

  一種很基礎的設計模式,簡而言之就是用函數來封裝以特定接口創建對象的細節。

function createAnimal(name,type){
    var o = new Object();
    o.name = name;
    o.type = type;
    o.sayName = function(){
        alert(this.name)
    }
    return o;
}
var cat = createAnimal(小貓,cat);
var dog = createAnimal(小狗,dog);

JavaScript面向對象總結