js繼承封裝（一）

//定義乙個修改command函式
function
updatecommand
(path) 
}updatecommand.prototype.execute = function
() //定義乙個查詢command函式
function
querycommand
(path) 
var querycommand = new querycommand();
alert(querycommand.name);
//這裡輸出了 修改命令 簡單的實現了在querycommand裡面取得了updatecommand裡面的值，
querycommand.executefun();
//呼叫到了updatecommand的類方法。
querycommand.execute();
//執行失敗

這就牽扯乙個問題，採用原型方式編寫函式與採用類函式的優缺點問題：

//採用類方法編寫乙個函式
var　person=function
()    this.getage=function()}
//採用原型繼承的方式編寫乙個函式
var user=function
()user.prototype.getname=function
()user.prototype.getage=function
()var per=new person();
alert(per.getname());//輸出張三
var us=new user();
alert(us.getname());//輸出張三

其實從呼叫過程、輸出結果來看，倆者也沒有太大區別，類方法：每次例項化乙個例項物件時，就要為其分配記憶體，當介面產生多個person例項物件時，就會開闢多個類方法的記憶體。而原型方法是共享的，不會重複占有記憶體。所以從記憶體角度考慮的話推薦採用原型繼承方式來擴充套件。

在最上面的測試querycommand.execute();無法執行的，那我們可以採用原型繼承的方式來擴充套件。

繼承方式二：原型繼承方式

//定義乙個修改command函式
function
updatecommand
(path) 
updatecommand.prototype.execute = function
() //定義乙個查詢command函式
function
querycommand
(path) 
querycommand.prototype=new updatecommand();
var querycommand = new querycommand("/test.jsp");
querycommand.execute();
//會輸出 【傳送請求2字樣】 表示querycommand擁有了updatecommand 的原型方法。
alert(querycommand.name);
//但這裡會輸出 undifined 並沒有輸出【修改命令】四個字， 上面採用call繼承能獲取該屬性，但採用原型繼承則不行。

在此實現原型繼承使用的

querycommand.prototype=new updatecommand();

的方式來實現的。在此基礎上有人就會提出結合2者的優勢來實現繼承，這樣就繼承了原型方法，又繼承了類屬性、類方法。

繼承方式三：call與原型繼承的結合

//定義乙個修改command函式
function
updatecommand
(path) 
updatecommand.prototype.execute = function
() //定義乙個查詢command函式
function
querycommand
(path) 
querycommand.prototype=new updatecommand();
var querycommand = new querycommand("/test.jsp");
querycommand.execute();
//輸出了【傳送請求2】
alert(querycommand.name);
//輸出了【修改命令】

到此可能認為已經完美實現函式繼承，但這種方式存在問題沒呢？

function
querycommand
(path)

**querycommand.prototype=new updatecommand();**
//這裡又例項化一次updatecommand物件

也就是只要初始化乙個querycommand物件的同時，會例項化updatecommand物件2次。

當然在此updatecommand物件比較小，例項化幾次對程式影響不大，但如果updatecommand比較龐大，而且使用頻繁的時候，這可能就是個致命的問題。

為了解決這個問題請看 js繼承封裝（二）

js繼承封裝

function.prototype.extends function superclass f.prototype superclass.prototype this prototype newf 獲取當前類所有屬性名 var names object.getownpropertynames o ...

JS封裝繼承函式

1 function extend child,parent 3 f.prototype parent.prototype 4 child.prototype new f 5 child.prototype child 6 child.uber parent.prototype uber指向父物件的...

JS封裝繼承函式

1 function extend child,parent 3 f.prototype parent.prototype 4 child.prototype new f 5 child.prototype child 6 child.uber parent.prototype uber指向父物件的...

js繼承封裝（一）

js繼承封裝

JS封裝繼承函式

JS封裝繼承函式

相關推薦