JS繼承用法實例分析
本文實例分析了JS繼承的用法。分享給大家供大家參考。具體分析如下:
繼承 : 子類不影響父類,子類可以繼承父類的一些功能 ( 代碼復(fù)用 )
屬性的繼承 : 調(diào)用父類的構(gòu)造函數(shù) call
方法的繼承 : for in : 拷貝繼承 (jquery也是采用拷貝繼承extend)
1. 拷貝繼承
function Person (name){
this.name = name;
}
Person.prototype.showName =function (){
alert(this.name);
}
function Worker(name,job){
Person.call(this,name);
this.job = job;
}
extend(Worker.prototype, Person.prototype);
//如果用Worker.prototype=Person.prototype的話,會造成引用相同的問題
function extend(obj1,obj2){
for(var i in obj2){
obj1[i] = obj2[i]
}
}
var coder = new Worker('magicfly','frontEnd');
coder.showName();
2. 類繼承
function Person (name){
this.name = name;
}
Person.prototype.showName =function (){
alert(this.name);
}
function Worker(name,job){
Person.call(this,name);
this.job = job;
}
//Worker.prototype = new Person();
// 這樣繼承會繼承父級的不必要屬性
function F(){};
F.prototype = Person.prototype;
Worker.prototype = new F();
//通過建立一個臨時構(gòu)造函數(shù)來解決 ,也稱為代理函數(shù)
var coder = new Worker('MAGICFLY','START');
coder.showName();
3. 原型繼承
var a = {
name : '小明'
};
var b = cloneObj(a);
b.name = '小強(qiáng)';
//alert( b.name );
alert( a.name );
function cloneObj(obj){
var F = function(){};
F.prototype = obj;
return new F();
}
適用情況
拷貝繼承: 通用型的 有new或無new的時候都可以
類式繼承: new構(gòu)造函數(shù)
原型繼承: 無new的對象
希望本文所述對大家的javascript程序設(shè)計有所幫助。
相關(guān)文章
js動態(tài)生成按鈕并動態(tài)生成8位隨機(jī)數(shù)
用js生成按鈕,動態(tài)生成8位隨機(jī)數(shù)的腳本2008-09-09
Open and Print a Word Document
Open and Print a Word Document...2007-06-06
基于JS實現(xiàn)bookstore靜態(tài)頁面的實例代碼
本文給大家分享一段核心代碼基于js實現(xiàn)的bookstore靜態(tài)頁面,代碼簡單易懂,非常不錯,具有參考借鑒價值,需要的朋友參考下2017-02-02
微信小程序如何調(diào)用json數(shù)據(jù)接口并解析
這篇文章主要介紹了微信小程序如何調(diào)用json數(shù)據(jù)接口并解析,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2019-06-06
javascript獲取ckeditor編輯器的值(實現(xiàn)代碼)
這篇文章主要介紹了javascript獲取ckeditor編輯器的值,用于表單驗證。需要的朋友可以過來參考下,希望對大家有所幫助2013-11-11

