JavaScript實(shí)現(xiàn)多態(tài)和繼承的封裝操作示例
本文實(shí)例講述了JavaScript實(shí)現(xiàn)多態(tài)和繼承的封裝操作。分享給大家供大家參考,具體如下:
封裝Encapsulation
如下代碼,這就算是封裝了
(function (windows, undefined) {
var i = 0;//相對(duì)外部環(huán)境來(lái)說(shuō),這里的i就算是封裝了
})(window, undefined);
繼承Inheritance
(function (windows, undefined) {
//父類
function Person() { }
Person.prototype.name = "name in Person";
//子類
function Student() { }
Student.prototype = new Person(); //修復(fù)原型
Student.prototype.constructor = Student; //構(gòu)造函數(shù)
Student.prototype.supr = Person.prototype; //父類
//創(chuàng)建子類實(shí)例
var stu = new Student();
Student.prototype.age = 28;
Student.prototype.name = "name in Student instance";
//打印子類成員及父類成員
console.log(stu.name); //name in Student instance
console.log(stu.supr.name); //name in Person
console.log(stu.age); //28
})(window, undefined);
使用在線HTML/CSS/JavaScript代碼運(yùn)行工具 http://tools.jb51.net/code/HtmlJsRun,運(yùn)行結(jié)果如下:

多態(tài)Polymorphism
有了繼承,多態(tài)就好辦了
//這就是繼承了
(function (windows, undefined) {
//父類
function Person() { }
Person.prototype.name = "name in Person";
Person.prototype.learning = function () {
console.log("learning in Person")
}
//子類
function Student() { }
Student.prototype = new Person(); //修復(fù)原型
Student.prototype.constructor = Student; //構(gòu)造函數(shù)
Student.prototype.supr = Person.prototype; //父類
Student.prototype.learning = function () {
console.log("learning in Student");
}
//工人
function Worker() { }
Worker.prototype = new Person(); //修復(fù)原型
Worker.prototype.constructor = Worker; //構(gòu)造函數(shù)
Worker.prototype.supr = Person.prototype; //父類
Worker.prototype.learning = function () {
console.log("learning in Worker");
}
//工廠
var personFactory = function (type) {
switch (type) {
case "Worker":
return new Worker();
break;
case "Student":
return new Student();
break;
}
return new Person();
}
//客戶端
var person = personFactory("Student");
person.learning(); //learning in Student
person = personFactory("Worker");
person.learning(); //learning in Worker
})(window, undefined);
使用在線HTML/CSS/JavaScript代碼運(yùn)行工具 http://tools.jb51.net/code/HtmlJsRun,運(yùn)行結(jié)果如下:

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《javascript面向?qū)ο笕腴T教程》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》
希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
相關(guān)文章
微信小程序?qū)崿F(xiàn)基于三元運(yùn)算驗(yàn)證手機(jī)號(hào)/姓名功能示例
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)基于三元運(yùn)算驗(yàn)證手機(jī)號(hào)/姓名功能,涉及三元運(yùn)算符的判定及字符串正則驗(yàn)證相關(guān)操作技巧,需要的朋友可以參考下2019-01-01
javascript 函數(shù)調(diào)用規(guī)則
構(gòu)造器函數(shù)以大寫(xiě)字母開(kāi)頭是一個(gè)好的習(xí)慣,這可以作為一個(gè)提醒,讓你在調(diào)用的時(shí)候不要忘記前面的new運(yùn)算符.2009-08-08
使用Perl和庫(kù)WWW::Curl的爬蟲(chóng)程序步驟
本文給大家分享在Perl中使用WWW::Curl庫(kù)編寫(xiě)爬蟲(chóng)程序的步驟和方法,感興趣的朋友跟隨小編一起看看吧2025-03-03
javascript 初學(xué)教程及五子棋小程序的簡(jiǎn)單實(shí)現(xiàn)
下面小編就為大家?guī)?lái)一篇javascript 初學(xué)教程及五子棋小程序的簡(jiǎn)單實(shí)現(xiàn)。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-07-07
JavaScript 預(yù)解析的4種實(shí)現(xiàn)方法解析
這篇文章主要介紹了JavaScript 預(yù)解析的4種實(shí)現(xiàn)方法解析,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-09-09
微信小程序wx.navigateTo中events屬性實(shí)現(xiàn)頁(yè)面間通信傳值,數(shù)據(jù)同步
這篇文章主要介紹了微信小程序wx.navigateTo中events屬性實(shí)現(xiàn)頁(yè)面間通信傳值,數(shù)據(jù)同步,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-07-07
深入學(xué)習(xí)js函數(shù)的隱式參數(shù) arguments 和 this
這篇文章主要介紹了 深入學(xué)習(xí)js函數(shù)的隱式參數(shù) arguments 和 this,arguments是一個(gè)類數(shù)組結(jié)構(gòu),它保存了調(diào)用時(shí)傳遞給函數(shù)的所有實(shí)參;this是函數(shù)執(zhí)行時(shí)的上下文對(duì)象, 這個(gè)對(duì)象有些讓人感到困惑的行為。 下面分別對(duì)他們進(jìn)行討論。,需要的朋友可以參考下2019-06-06
JS創(chuàng)建對(duì)象的十種方式總結(jié)
面向?qū)ο笫且环N重要的編程范式,如何靈活的創(chuàng)建對(duì)象,是對(duì)編程基本功的考驗(yàn),本來(lái)我們來(lái)探討一下JavaScript中創(chuàng)建對(duì)象的十種方式,感興趣的小伙伴可以了解下2023-10-10

