javascript創(chuàng)建對(duì)象、對(duì)象繼承的實(shí)用方式詳解
來(lái)源:易賢網(wǎng) 閱讀:657 次 日期:2016-07-22 15:39:48
溫馨提示:易賢網(wǎng)小編為您整理了“javascript創(chuàng)建對(duì)象、對(duì)象繼承的實(shí)用方式詳解”,方便廣大網(wǎng)友查閱!

JavaScript中的對(duì)象是基于原型的。原型是對(duì)象的基礎(chǔ),它定義并實(shí)現(xiàn)了一個(gè)新對(duì)象所必須包含的成員列表,并被所有同類對(duì)象實(shí)例所共享。與其他語(yǔ)言中類的概念相比,原型更像是類的靜態(tài)成員。本文著重給大家介紹javascript創(chuàng)建對(duì)象、對(duì)象繼承的實(shí)用方式

創(chuàng)建對(duì)象、對(duì)象繼承實(shí)際上是一回事:我們所需要的實(shí)例對(duì)象通過(guò)構(gòu)造函數(shù)獲得私有屬性、通過(guò)原型鏈獲得共享的屬性。什么是好的方式?私有屬性通過(guò)構(gòu)造函數(shù)的方式獲得(不考慮實(shí)例中自定義私有屬性)且不需要重寫,共享屬性通過(guò)原型鏈找到且不需要重復(fù)創(chuàng)建。

普適的方式

組合使用構(gòu)造函數(shù)模式和原型模式創(chuàng)建對(duì)象

function HNU_student(name) {

  this.name = name;

  this.sayName = function() {

    return this.name;

  };

}

HNU_student.prototype = {

  school: 'HNU',

  saySchool: function() {

    return this.school;

  }

};

Object.defineProperty(HNU_student, 'constructor', {value: HNU_student});

var hiyohoo = new HNU_student('xujian');

通過(guò)字面量的方式會(huì)重寫prototype,且原型的constructor指向了Object,必要的情況下需要重新定義constructor。

寄生組合式繼承

function object(o) {

  function F() {};

  F.prototype = o;

  return new F();

}

function inheritPrototype(child, parent) {

  var prototype = object(parent.prototype);

  prototype.constructor = child;

  child.prototype = prototype;

}

function HNU_student(name) {

  this.name = name;

  this.sayName = function() {

    return this.name;

  };

}

HNU_student.prototype.school = 'HNU';

HNU_student.prototype.saySchool = function() {

  return this.school;

};

function Student_2011(name, number) {

  HNU_student.call(this, name);

  this.number = number;

  this.sayNumber = function() {

    return this.number;

  }

}

inheritPrototype(Student_2011, HNU_student);

Student_2011.prototype.graduationTime = 2015;

Student_2011.prototype.sayGraduationTime = function() {

  return this.graduationTime;

};

var hiyohoo = new Student_2011('xujian', 20110803203);

object()的作用:將作為參數(shù)傳入的對(duì)象變成實(shí)例的原型,該對(duì)象的屬性被所有實(shí)例共享。

共享屬性:inheritPrototype(Student_2011, HNU_student);,子構(gòu)造函數(shù)原型成為超構(gòu)造函數(shù)原型的一個(gè)實(shí)例,超構(gòu)造函數(shù)原型中的屬性共享給子構(gòu)造函數(shù)。

私有屬性:HNU_student.call(this, name);,通過(guò)子構(gòu)造函數(shù)創(chuàng)建實(shí)例時(shí)調(diào)用超構(gòu)造函數(shù)創(chuàng)建私有屬性。

創(chuàng)建對(duì)象的其他方式

動(dòng)態(tài)原型模式

function HNU_student(name) {

  this.name = name;

  this.sayName = function() {

    return this.name;

  };

  if (!HNU_student.prototype.school) {

    HNU_student.prototype.school = 'HNU';

    HNU_student.prototype.saySchool = function() {

      return this.school;

    };

  }

}

var hiyohoo = new HNU_student('xujian');

將定義在原型中的共享屬性放入構(gòu)造函數(shù)中,使用判斷語(yǔ)句,在第一次調(diào)用構(gòu)造函數(shù)創(chuàng)建實(shí)例時(shí),初始化原型共享屬性。

寄生構(gòu)造函數(shù)模式

function SpecialArray() {

  var values = new Array();

  values.push.apply(values, arguments);

  values.toPipedString = function() {

    return this.join('|');

  };

  return values;

}

var colors = new SpecialArray('red', 'black', 'white');

用于為原生構(gòu)造函數(shù)添加特殊的屬性。

對(duì)象繼承的其他方式

組合繼承

function HNU_student(name) {

  this.name = name;

  this.sayName = function() {

    return this.name;

  };

}

HNU_student.prototype.school = 'HNU';

HNU_student.prototype.saySchool = function() {

  return this.school;

};

function Student_2011(name, number) {

  HNU_student.call(this, name);

  this.number = number;

  this.sayNumber = function() {

    return this.number;

  };

}

Student_2011.prototype = new HNU_student();

Student_2011.prototype.constructor = Student_2011;

Student_2011.prototype.graduationTime = 2015;

Student_2011.prototype.sayGraduationTime = function() {

  return this.graduationTime;

}

var hiyohoo = new Student_2011('xujian', 20110803203);

共享屬性:Student_2011.prototype = new HNU_student();,子構(gòu)造函數(shù)的原型就指向了超構(gòu)造函數(shù)的原型,實(shí)例通過(guò)原型鏈找到所有共享的屬性。

私有屬性:HNU_student.call(this, name);,通過(guò)子構(gòu)造函數(shù)創(chuàng)建實(shí)例時(shí)調(diào)用超構(gòu)造函數(shù)創(chuàng)建私有屬性。

缺陷:超構(gòu)造函數(shù)被調(diào)用了兩遍。Student_2011.prototype = new HNU_student();的同時(shí),在子構(gòu)造函數(shù)原型中創(chuàng)建了超構(gòu)造函數(shù)定義的私有屬性,這些原型中的私有屬性被實(shí)例中的同名屬性覆蓋屏蔽。

原型式繼承、寄生式繼承

function object(o) {

  function F() {}

  F.prototype = o;

  return new F();

}

var student1 = {

  school: 'HNU',

  saySchool: function() {

    return this.school;

  }

};

var student2 = object(student1);

Object.creat()是ECMAScript5新增的方法,接受兩個(gè)參數(shù):一是作為原型的原對(duì)象,二是重寫或新增屬性的對(duì)象,作用與自定義的object()相同。

var student1 = {

  name: 'xujian',

  school: 'HNU'

};

var student2 = Object.create(student1, {

  name: {

    value: 'huangjing'

  }

});

寄生式繼承在原型式繼承的基礎(chǔ)上添加了額外的屬性用來(lái)增強(qiáng)對(duì)象。

function object(o) {

  function F() {}

  F.prototype = o;

  return new F();

}

function creatAnother(original) {

  var clone = object(original);

  clone.sayHi = function() {

    alert('Hi!');

  };

  return clone;

}

var student1 = {

  school: 'HNU',

  saySchool: function() {

    return this.school;

  }

};

var student2 = creatAnother(student1);

原型式繼承和寄生式繼承用于創(chuàng)建與已有對(duì)象類似的實(shí)例對(duì)象。

更多信息請(qǐng)查看網(wǎng)絡(luò)編程
由于各方面情況的不斷調(diào)整與變化,易賢網(wǎng)提供的所有考試信息和咨詢回復(fù)僅供參考,敬請(qǐng)考生以權(quán)威部門公布的正式信息和咨詢?yōu)闇?zhǔn)!

2025國(guó)考·省考課程試聽報(bào)名

  • 報(bào)班類型
  • 姓名
  • 手機(jī)號(hào)
  • 驗(yàn)證碼
關(guān)于我們 | 聯(lián)系我們 | 人才招聘 | 網(wǎng)站聲明 | 網(wǎng)站幫助 | 非正式的簡(jiǎn)要咨詢 | 簡(jiǎn)要咨詢須知 | 新媒體/短視頻平臺(tái) | 手機(jī)站點(diǎn) | 投訴建議
工業(yè)和信息化部備案號(hào):滇ICP備2023014141號(hào)-1 云南省教育廳備案號(hào):云教ICP備0901021 滇公網(wǎng)安備53010202001879號(hào) 人力資源服務(wù)許可證:(云)人服證字(2023)第0102001523號(hào)
云南網(wǎng)警備案專用圖標(biāo)
聯(lián)系電話:0871-65099533/13759567129 獲取招聘考試信息及咨詢關(guān)注公眾號(hào):hfpxwx
咨詢QQ:1093837350(9:00—18:00)版權(quán)所有:易賢網(wǎng)
云南網(wǎng)警報(bào)警專用圖標(biāo)