JavaScript建立對象方法實例小結

本文實例講述了JavaScript建立對象方法。分享給你們供你們參考，具體以下：

最簡單的方式就是建立一個Object對象，併爲其添加屬性和方法。

//示例代碼
var person=new Object()
person.name="yumi"
person.age=18
person.job="coder"
person.sayName=function(){
  alert(this.name)
}
person.sayName()//輸出yumi
//前端全棧學習交流圈：866109386
//面向1-3年經驗前端人員
//幫助突破技術瓶頸，提高思惟能力

這種方式使用同一個接口建立多個對象，會出現大量重複代碼。

1.工廠模式

JavaScript中沒法建立類，咱們能夠用函數來封裝以特定接口建立對象的細節。

//示例代碼
function createPerson(name,age,job){
  var o=new Object();
  o.name=name;
  o.age=age;
  o.job=job;
  o.sayName=function(){
    alert(this.name)
  };
  return o;
}
var person1=createPerson("yumi",18,"coder");
var person2=createPerson("echo",21,"player");
person1.sayName();//輸出yumi
person2.sayName();//輸出echo

工廠模式雖然解決了建立多個類似對象的問題，但卻沒有解決對象識別問題，即怎樣知道一個對象的類型。

2.構造函數模式

能夠建立自定義的構**造函數，從而定義自定義對象類型的屬性和方法。

//示例代碼
function Person(name,age,job){
  this.name=name;
  this.age=age;
  this.job=job;
  this.sayName=function(){
    alert(name);
  }
}
var person1=new Person("yumi",18,"coder");
var person2=new Person("echo",21,"player");
person1.sayName();//輸出yumi
person2.sayName();//輸出echo

建立出的對象既是Object的實例，也是Person的實例，也就是說未來咱們能夠將它的實例標識爲特定類型，這也是優於工廠模式的地方。可是構造函數模式也有缺點，即就是每實例化一個對象，對象方法都會建立一遍，咱們能夠按以下方法稍加改進：

//示例代碼
function Person(name,age,job){
  this.name=name;
  this.age=age;
  this.job=job;
  this.sayName=sayName;
}
function sayName(){
  alert(name);
}
var person1=new Person("yumi",18,"coder");
var person2=new Person("echo",21,"player");
person1.sayName();
person2.sayName();
//前端全棧學習交流圈：866109386
//面向1-3年經驗前端開發人員
//幫助突破技術瓶頸，提高思惟能力

將函數拿到構造函數外部，構造函數內部將sayName屬性設成全局sayName函數（通常單獨的函數名存放的是指向該函數的指針，而函數名加括號爲該函數的執行結果）。但這樣作，暴露出的問題是：全局做用域中定義的函數只能被某一個對象調用，不符合全局定義了。並且，若是某個對象有不少方法，這些方法都定義在全局做用域的話，也就沒什麼封裝性可言了。

3.原型模式

前面咱們說了，構造函數模式的缺點是屬性或方法在構造函數做用域中只能被某個對象調用，想一想咱們在其餘面嚮對象語言中的處理方式，是將公用的屬性方法定義在父類中，而後經過繼承父類調用。可是JavaScript中不存在類、繼承這些概念，而是經過原型鏈實現「繼承」。

下面就是咱們要說的原型模式：

//示例代碼
function Person(){
  Person.prototype.name"yumi";
  Person.prototype.age=18;
  Person.prototype.job=coder;
  Person.prototype.sayName=function(){
    alert(name);
  }
}
var person1=new Person();
var person2=new Person();
person1.sayName();  //"yumi"
person2.sayName();  //"yumi"
alert(person1.sayName==person2.sayName);  //true

不管何時，只要建立了一個新函數，就會爲該函數建立一個prototype屬性。默認狀況下，全部prototype屬性都會自動得到一個constructor(構造函數)屬性。這個屬性包含一個指向prototype屬性所在函數的指針。也就是說，Person能夠理解爲一個類（實際是個函數），Person.prototype指向原型（原型中定義的方法或屬性能夠被對象調用，至關於一個共享區域），而後Person.prototype.constructor又指向了Person。實例化的對象有一個內部屬性能夠指向Person.prototype，可是不能指向構造函數constructor，跟其無關。