成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

JS 設(shè)計模式 三（繼承）

shusen / 1029人閱讀

摘要：什么是繼承繼承是一種減少重復(fù)性代碼的一種設(shè)計模式，盡量弱化對象間耦合，開閉原則的一種很好的實現(xiàn)。三摻元類這種繼承方式是為了擴(kuò)充類的一些重復(fù)函數(shù)而不重寫代碼，這個也是一種多繼承的效果。所以在使用的繼承前，最好可以很好的理解下原型鏈這個概念。

什么是繼承

繼承是一種減少重復(fù)性代碼的一種設(shè)計模式，盡量弱化對象間耦合，開閉原則的一種很好的實現(xiàn)。

javascript繼承

由于javascript的語言特性，它的繼承也被分為了3中實現(xiàn)方式

一、類繼承 
function extend(subClass, superClass) {
  var F = function () {
  };
  F.prototype = superClass.prototype;
  subClass.prototype = new F();
  subClass.prototype.constructor = subClass;

  subClass.superclass = superClass.prototype;
  if (superClass.prototype.constructor == Object.prototype.constructor) {
    superClass.prototype.constructor = superClass;
  }
}

function Person(name) {
  this.name = name;
}
Person.prototype.getName = function () {
  return this.name;
}
function Author(name, books) {
  Author.superclass.constructor.call(this, name);
  this.books = books;
}
extend(Author, Person);
Author.prototype.getBooks = function () {
  return this.books;
};
Author.prototype.getName = function () {
  var name = Author.superclass.getName.call(this);
  return name + ", Author of " + this.getBooks().join(", ");
};

var hugo = new Author("hugo", ["Notre-Dame de Paris"]);
hugo.getName();
hugo.getBooks();

這種繼承方式比較適合不熟悉javascript語言原型的程序員使用。

二、原型繼承 
function clone(object) {
  function F() {
  }

  F.prototype = object;
  return new F;
}

var Person = {
  name: "默認(rèn)值",
  getName: function () {
    return this.name;
  }
}

var Author = clone(Person);
Author.books = []; // Default value.
Author.getBooks = function() {
  return this.books;
}
hugo = clone(Author);
hugo.name = "hugo";
hugo.books =["Notre-Dame de Paris"];
hugo.getName();
hugo.getBooks();

這種繼承比較節(jié)約內(nèi)存。但是理解更加復(fù)雜。起屬性默認(rèn)值指向父類屬性。

三、摻元類 
function augment(receivingClass, givingClass) {
  if(arguments[2]) { // Only give certain methods.
    for(var i = 2, len = arguments.length; i < len; i++) {
      receivingClass.prototype[arguments[i]] = givingClass.prototype[arguments[i]];
    }
  }
  else { // Give all methods.
    for(methodName in givingClass.prototype) {
      if(!receivingClass.prototype[methodName]) {
        receivingClass.prototype[methodName] = givingClass.prototype[methodName];
      }
    }
  }
}

var Mixin = function() {};
Mixin.prototype = {
  serialize: function() {
    var output = [];
    for(key in this) {
      output.push(key + ": " + this[key]);
    }
    return output.join(", ");
  }
};

function Person(name) {
  this.name = name;
}
Person.prototype.getName = function () {
  return this.name;
}

augment(Person, Mixin,"serialize");
var hugo = new Person("hugo");
hugo.serialize();

這種繼承方式是為了擴(kuò)充類的一些重復(fù)函數(shù)而不重寫代碼，這個也是一種多繼承的效果。

總結(jié)

javascript的繼承大體上使用原型的方式會比較節(jié)省內(nèi)存空間，不過也有一定的使用難度。不過在理解了原型以后就可以這是一種非常簡化的繼承方式，對于擴(kuò)展也很方便。所以在使用javascript的繼承前，最好可以很好的理解下原型鏈這個概念。

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/87760.html

相關(guān)文章

  • Javascript 設(shè)計模式讀書筆記(三)——繼承

    摘要：的繼承方式屬于原型式繼承，非常靈活。當(dāng)使用關(guān)鍵字執(zhí)行類的構(gòu)造函數(shù)時，系統(tǒng)首先創(chuàng)建一個新對象，這個對象會繼承自構(gòu)造函數(shù)的原型對象新對象的原型就是構(gòu)造函數(shù)的屬性。也就是說，構(gòu)造函數(shù)用來對生成的新對象進(jìn)行一些處理，使這個新對象具有某些特定的屬性。 繼承這個東西在Javascript中尤其復(fù)雜，我掌握得也不好，找工作面試的時候在這個問題上栽過跟頭。Javascript的繼承方式屬于原型式繼承，...

    cangck_X 評論0 收藏0

  • js面向?qū)ο鬁\談（三）

    摘要：還有一個問題，就是不能在創(chuàng)建子類性時，像父類型的構(gòu)造函數(shù)傳遞參數(shù)。組合繼承將原型鏈和借用構(gòu)造函數(shù)組合到一起，發(fā)揮兩者之長的一張繼承模式，下面來看個例子。組合繼承最大的問題是無論在什么情況下，都會調(diào)用兩次父類型構(gòu)造函數(shù)。 繼承 繼承是面向?qū)ο笳Z言中特別重要的概念，js的繼承主要是靠原型鏈實現(xiàn)的。 原型鏈?。?！ 看到我給標(biāo)題打了三個嘆號嗎，這里真的很重要！這里真的很重要！這里真的很重要！j...

    awkj 評論0 收藏0

  • React.js 小書 Lesson4 - 前端組件化（三）：抽象出公共組件類

    摘要：最后抽離出來了一個類，可以幫助我們更好的做組件化。一個組件有自己的顯示形態(tài)上面的結(jié)構(gòu)和內(nèi)容行為，組件的顯示形態(tài)和行為可以由數(shù)據(jù)狀態(tài)和配置參數(shù)共同決定。接下來我們開始正式進(jìn)入主題，開始正式介紹。下一節(jié)鏈接直達(dá)小書基本環(huán)境安裝 React.js 小書 Lesson4 - 前端組件化（三）：抽象出公共組件類 本文作者：胡子大哈本文原文：http://huziketang.com/books...

    jsbintask 評論0 收藏0

  • JS面向?qū)ο蟮某绦?em>設(shè)計之繼承的實現(xiàn) - 原型鏈

    摘要：簡單回顧一下構(gòu)造函數(shù)原型和實例對象之間的關(guān)系每個構(gòu)造函數(shù)都有一個原型對象。找到生成構(gòu)造函數(shù)的原型對象的構(gòu)造函數(shù)，搜索其原型對象，找到了。 JS面向?qū)ο蟮某绦蛟O(shè)計之繼承的實現(xiàn) - 原型鏈 前言：最近在細(xì)讀Javascript高級程序設(shè)計，對于我而言，中文版，書中很多地方翻譯的差強人意，所以用自己所理解的，嘗試解讀下。如有紕漏或錯誤，會非常感謝您的指出。文中絕大部分內(nèi)容引用自《JavaS...

    zhaochunqi 評論0 收藏0

  • 18年求職面經(jīng)及總結(jié)

    摘要：年求職面經(jīng)及總結(jié)我的求職之路差不多走到盡頭了感覺真是精疲力盡了把這大半年的經(jīng)歷和面試總結(jié)寫下來希望能給和我一樣在求職路上煎熬的人一點幫助先說背景微電子科學(xué)與工程專業(yè)學(xué)過兩門和相關(guān)的課程語言和單片機這個專業(yè)的唯一好處就是大部分人并不知道這個專 18年求職面經(jīng)及總結(jié) 我的求職之路差不多走到盡頭了,感覺真是精疲力盡了.把這大半年的經(jīng)歷和面試總結(jié)寫下來,希望能給和我一樣在求職路上煎熬的人一點幫...

    zhangwang 評論0 收藏0

發(fā)表評論

0條評論

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