JS原型與繼承操作示例
更新時間：2019年05月09日 11:29:26 作者：Yxh_blogs
這篇文章主要介紹了JS原型與繼承操作,涉及javascript面向?qū)ο蟪绦蛟O(shè)計中原形與繼承的相關(guān)定義、實例化操作技巧,需要的朋友可以參考下
本文實例講述了JS原型與繼承操作。分享給大家供大家參考，具體如下：
<script>
var Beverage = function(){};
Beverage.prototype.boilWater = function(){
console.log("把水煮沸");
};
Beverage.prototype.brew = function(){
throw new Error("子類必須重寫該方法");
};
Beverage.prototype.pourInCup = function(){
throw new Error("子類必須重寫該方法");
};
Beverage.prototype.addCondiments = function(){
throw new Error("子類必須重寫該方法");
};
Beverage.prototype.customerWantsCondiments = function(){
return true;
};
Beverage.prototype.init = function(){
this.boilWater();
this.brew();
this.pourInCup();
if(this.customerWantsCondiments){
this.addCondiments();
}
};
var Coffee = function(){};
Coffee.prototype = new Beverage();//繼承父類Beverage
Coffee.prototype.boilWater = function(){
console.log("把水煮沸");
};
Coffee.prototype.brew = function(){
console.log("用沸水沖泡咖啡");
};
Coffee.prototype.pourInCup = function(){
console.log("把咖啡倒進杯子");
};
Coffee.prototype.addCondiments = function(){
console.log("加糖和牛奶");
};
var Tea = function(){};
Tea.prototype = new Beverage();//繼承父類Beverage
Tea.prototype.boilWater = function(){
console.log("把水煮沸");
};
Tea.prototype.brew = function(){
console.log("用沸水浸泡茶葉");
};
Tea.prototype.pourInCup = function(){
console.log("把茶水倒進杯子");
};
Tea.prototype.addCondiments = function(){
console.log("加入檸檬");
};
Tea.prototype.customerWantsCondiments = function(){
return window.confirm("請問需要加調(diào)料嗎?");
};
var coffee = new Coffee();//實例化Coffee
coffee.init();
var tea = new Tea();//實例化Tea
tea.init();
</script>
這里使用在線HTML/CSS/JavaScript代碼運行工具：http://tools.jb51.net/code/HtmlJsRun測試運行結(jié)果如下：
更多關(guān)于JavaScript相關(guān)內(nèi)容還可查看本站專題：《javascript面向?qū)ο笕腴T教程》、《JavaScript錯誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運算用法總結(jié)》
希望本文所述對大家JavaScript程序設(shè)計有所幫助。
相關(guān)文章
下面小編就為大家?guī)硪黄猨s實現(xiàn)隨機點名系統(tǒng)(實例講解)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-10-10
利用原生JavaScript實現(xiàn)造日歷輪子實例代碼
這篇文章主要給大家介紹了關(guān)于如何利用原生JavaScript實現(xiàn)造日歷輪子的相關(guān)資料，文中通過示例代碼介紹的非常詳細，對大家學(xué)習(xí)或者使用JavaScript具有一定的參考學(xué)習(xí)價值，需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05
js工具方法彈出蒙版，需要的朋友可以參考一下2013-05-05
現(xiàn)在手機網(wǎng)站已經(jīng)很普及了，有時候前端網(wǎng)頁需要判斷，用戶使用的是手機瀏覽器還是電腦瀏覽器。這篇文章整理了JavaScript判斷是否手機瀏覽器的五種方法，通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值2022-11-11
JavaScript 實現(xiàn)的checkbox經(jīng)典實例分享
本文主要給大家分享的是JavaScript實現(xiàn)checkbox多項選擇的經(jīng)典代碼，非常的簡單實用，有需要的小伙伴可以參考下2016-10-10
詳解如何在JavaScript中創(chuàng)建線性儀表圖
線性儀表圖表示顯示所需值的垂直或水平線性刻度，帶有顏色刻度以及單個或多個指針。本文將詳細講解如何利用JavaScript創(chuàng)建線性儀表圖，需要的可以參考一下2022-03-03
我們知道，數(shù)組的sort方法可以對數(shù)組元素進行排序，默認是按ASCII字母表順序排序。如果要根據(jù)其他的順序排序就需要為sort方法提供一個比較函數(shù)作為參數(shù)。這里講的就是如何寫這個比較函數(shù)。2010-07-07
這篇文章主要介紹了一次記住JavaScript的6個正則表達式方法,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2018-02-02
這篇文章主要介紹了JS圖片無縫、平滑滾動的實現(xiàn),需要的朋友可以參考下2014-03-03
這篇文章主要介紹了JS模擬并美化的表單控件實現(xiàn)方法,涉及javascript結(jié)合css樣式美化表單的功能,非常美觀實用,需要的朋友可以參考下2015-08-08