国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

Javascript學習之創建對象

jollywing / 2169人閱讀

摘要：在中，除了幾種原始類型外，其余皆為對象，，既然對象如此重要，那就列舉一下在中如何創建對象通過構造函數創建對象實例對象字面量對象字面量是對象定義的一種簡寫形式，目的在于簡化創建包含大量屬性的對象的過程。

在Javascript中，除了幾種原始類型外，其余皆為對象（Object，Array ...），既然對象如此重要，那就列舉一下在Javascript中如何創建對象：

通過Object構造函數創建對象實例
var person = new Object();
person.name = "krew";
person.age = 26;
對象字面量

對象字面量是對象定義的一種簡寫形式，目的在于簡化創建包含大量屬性的對象的過程。

var person = {
  name : "krew",
  age : 26
}
工廠模式

工廠模式是一種設計模式，通過對創建具體對象的過程進行抽象。使用函數來封裝創建對象的細節，可以無數次地調用用該函數，每次都可以得到包含制定內容的對象。

function personFactory(name, age){
  var obj = new Object();
  obj.name = name;
  obj.age = age;
  obj.sayName = function(){
    console.log(this.name);
  }
  return obj;
}

var person1 = personFactory("krew", 26);  
var person2 = personFactory("john", 20);
構造函數模式

基于工廠模式創建對象雖然方便，但是創建出來的對象沒有特定的對象類型（比如原生對象Object, Array的實例都有自己的類型），所以就采用構造函數模式來創建對象，就能解決識別對象類型的問題。

function Person(name, age){
  this.name = name;
  this.age = age;
  this.sayName = function() {
    console.log(this.name);
  }
}

var person1 = new Person("krew", 26);
var person2 = new Person("john", 20);

person1.sayName();  // "krew"
person2.sayName();  // "john"

person1.constructor == Person  // true
person2.constructor == Person  // true
原型模式

每個函數在創建的時候，就會根據特定的規則為該函數創建一個prototype屬性，這個屬性是指向函數的原型對象的指針。這個原型對象的包含可以由特定類型的所有實例共享的屬性和方法。所以，在構造函數的prototype屬性上添加屬性與方法，該構造函數的所有實例都會在原型鏈上查找到這些屬性與方法。

function Person() {
}
Person.prototype.name = "krew";
Person.prototype.age = 26;
Person.prototype.sayName = function() {
  console.log(this.name);
}

var person1 = new Person();
var person2 = new Person();

person1.sayName();  // "krew"
person2.sayName();  // "krew"
組合構造函數和原型模式

由于原型對象中的屬性是被很多實例所共享的，對于引用類型的屬性值，將會存在實例間無法隔離的問題：

function Person() {
}
Person.prototype = {
  constructor : Person,
  name : "krew",
  age : 26,
  friends : ["john", "kitty"],
  showFriends : function() {
    console.log(this.friends);
  }
}
var person1 = new Person();
var person2 = new Person();

person1.friends.push("petter");

person1.showFriends()  // ["john", "kitty", "petter"]
person2.showFriends()  // ["john", "kitty", "petter"]

可以看到，僅是在實例person1的friends屬性上添加值，但person2也跟著變化。這是因為friends數組存在于Person.prototype而非person1中，person1與person2中的friends皆為引用Person.prototype中的friends，所以當通過person1來改變friends的時候，person2中的friends也會反映出來。
通過組合構造函數與原型模式可以解決上面出現的問題，構造函數模式用于定義實例屬性，而原型模式用于定義方法和共享的屬性，每個實例會有自己的一份實例屬性，同時又共享著方法的引用，極大的節省了內存。

function Person(name, age) {
  this.name = name;
  this.age = age;
}

Person.prototype.sayName = function() {
  console.log(this.name);
}

var person1 = new Person("krew", 26);
var person2 = new Person("john", 20);

person1.sayName();  // "krew"
person2.sayName();  // "john"
動態原型模式
function Person(name, age){
  this.name = name;
  this.age = age;
  if (typeof this.sayName != "function") {
    Person.prototype.sayName = function() {
      console.log(this.name);
    }
  }
}

var person1 = new Person("krew", 26);
var person2 = new Person("john", 20);

person1.sayName();  // "krew"
person2.sayName();  // "john"
寄生構造函數模式
function Person(name, age) {
  var obj = new Object();
  obj.name = name;
  obj.age = age;
  obj.sayName = function() {
    console.log(this.name);
  }
  return obj;
}

var person1 = new Person("krew", 26);
var person2 = new Person("john", 20);

person1.sayName();  // "krew"
person2.sayName();  // "john"
穩妥構造函數模式
function Person(name) {
  var obj = new Object();
  obj.sayName = function() {
    console.log(name);
  }
  return obj;
}

var person1 = Person("krew");
var person2 = Person("john");

person1.sayName();  // "krew"
person2.sayName();  // "john"

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/88229.html

相關文章

  • JavaScript學習之Object(下)new命令

    摘要：命令作用作用是執行構造函數，返回實例對象上面例子是自定義一個構造函數，其最大的特點就是首字母大寫，用執行構造函數其中，在的執行下，代表了實例化后的對象，這個也就有屬性注意點如果不用執行構造函數，那么指向的是全局有兩種方式可以避免內部定義嚴格 new命令 new作用 作用是執行構造函數，返回實例對象 function F() { this.name = object } var ...

    Salamander 評論0 收藏0

  • JavaScript學習之零碎記憶點總結記錄(一)

    摘要：總結記錄常見的五種類型報錯語法解析錯誤變量未定義變量類型錯誤數組越界相關函數參數錯誤能防止報錯導致后面代碼不能執行問題的未定義不影響后面函數的執行注意點在報錯前，不執行里的內容不報錯也不執行在報錯后，的內容不會被執行執行完結束，如果有 總結記錄 try-catch-finally 常見的五種類型報錯 SyntaxError語法解析錯誤 ReferenceError變量未定義 Type...

    fou7 評論0 收藏0

  • JavaScript學習之對象原型及繼承

    摘要：原型要掌握這三者之間的關系，通過代碼例子記錄一下自身屬性的這里就是通過代碼看一下做了什么默認情況下，將的所有屬性包括繼承的賦值給有什么東西呢自己的原型鏈，添加一個屬性，用來指明對象的誰構造的自身全部屬性，這邊構建一個空對象原型，所以沒有自有 原型 要掌握這三者之間的關系prototype，constructor,__proto__通過代碼例子記錄一下 function F() { ...

    妤鋒シ 評論0 收藏0

  • JavaScript學習之Object(下)相關方法

    摘要：它不區分該屬性是對象自身的屬性，還是繼承的屬性。那么我們要遍歷對象所有屬性，包括繼承以及不可遍歷的屬性，用加原型遍歷實現類似的用遞歸 Object靜態方法 Object自身方法，必須由Object調用，實例對象并不能調用 Object.getPrototypeOf() 作用是獲取目標對象的原型 function F() {}; var obj = new F(); console.lo...

    amuqiao 評論0 收藏0

  • Javascript學習之繼承

    摘要：繼承是面向對象編程語言中的一個重要的概念，繼承可以使得子類具有父類的屬性和方法或者重新定義追加屬性和方法等。但是在中沒有類的概念，是基于原型的語言，所以這就意味著對象可以直接從其他對象繼承。 繼承是面向對象編程語言中的一個重要的概念，繼承可以使得子類具有父類的屬性和方法或者重新定義、追加屬性和方法等。但是在Javascript中沒有類的概念，是基于原型的語言，所以這就意味著對象可以直接...

    CHENGKANG 評論0 收藏0

發表評論

0條評論

jollywing

男|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<