1. 程式人生 > >JavaScript面向物件程式設計建立物件的方法分析

JavaScript面向物件程式設計建立物件的方法分析

面向物件的語言具有一個共同的標誌,那就是具有“類”的概念,但是在javascript中沒有類的概念,在js中將物件定義為“無序屬性的集合,其屬性可以包含基本值,物件或者函式”,即其將物件看作是一組名值對的散列表。這樣問題就來了,如何建立物件呢?

在最開始時使用object建構函式和物件字面量來建立單個物件,下面簡要介紹這兩種方法。

object建構函式:建立自定義物件的最簡單方式就是建立一個object的例項,然後為這個例項新增屬性和方法:

var person=new object();
person.name="haha";
person.age=20;
person.job="搞笑工作者";
person.sayName=function(){
   alert(this.name);
};
//前端全棧學習交流圈:866109386
//面向1-3經驗年前端開發人員
//幫助突破技術瓶頸,提升思維能力

在上面的程式碼中,定義了一個person物件,並且添加了三個屬性和一個方法,其中方法採用的時函式表示式的方式實現,這是用object建構函式的方式建立一個物件。

物件字面量:

var person={
  name:"haha",
  age:20,
  job:"搞笑工作者",
  sayName:function(){
    alert(this.name);
  }
}

以上程式碼中同樣建立了一個person物件,這種方法類似於程式碼塊的方式,實現了對一個person物件的建立。

以上這兩種方法中,都需要大量重複定義,在我們需要建立物件時就需要重複以上程式碼,不夠精煉,所以出現了工廠模式和建構函式模式類建立物件的方法。

工廠模式:

工程模式抽象了建立具體物件的過程(專業書籍中給出),其實說的比較明白點就是採用函式的形式,用函式來封裝建立物件的過程,再建立物件時以呼叫函式的形式建立。例如:

function createPerson(name,age,job){
  var o=new object();
  o.name="haha";
  o.age=20;
  o.job="搞笑工作者";
  o.sayName=function(){
    alert(this.name);
  };
  return o;
}
var person1=createPerson("hehe",22,"呵呵工作者");
var person2=createPerson("heihei",23,"嘿嘿工作者");
//前端全棧學習交流圈:866109386
//面向1-3經驗年前端開發人員
//幫助突破技術瓶頸,提升思維能力

在這種工廠模式下,將以object建構函式建立物件的方法封裝到了一個函式中,在以後的建立物件的過程中,直接呼叫此方法就可以創建出一個接著一個的物件。

建構函式模式:

建構函式模式相對於工廠模式的優勢在於建構函式模式可以建立特定型別的物件。

function Person(name,age,job){
  this.name=name;
  this.age=age;
  this.job=job;
  this.sayName=function(){
    alert(this.name);
  };
}
var person1=new Person("hehe",22,"呵呵工作者");
var person2=new Person("heihei",23,"嘿嘿工作者");
//前端全棧學習交流圈:866109386
//面向1-3經驗年前端開發人員
//幫助突破技術瓶頸,提升思維能力

在以上程式碼中,定義一個Person()的方法,在Person()方法中,將其屬性進行了例項化,這種方法類似於在面嚮物件語言中在例項化類時直接會呼叫的建構函式,利用這種方法,將此函式大致相當於面嚮物件語言中的類,可以在以後的程式碼中不斷的例項化,用以不斷創建出此類的物件。在Javascript中,這種建構函式也是一種函式,不過是專門用於建立物件而已。