解開Ajax技術(shù)中的達(dá)芬奇密碼

2024-07-21 02:30:17

字體：大中小

供稿：網(wǎng)友

現(xiàn)在，ajax技術(shù)發(fā)展勢(shì)頭迅猛，開發(fā)者已經(jīng)建立了一個(gè)調(diào)用大量客戶端javascript、不斷增長(zhǎng)的、復(fù)雜的系統(tǒng)。因此，在javascript上嘗試oo技術(shù)便成為了管理復(fù)雜性的一種手段。在此過程中，多數(shù)開發(fā)者很快便認(rèn)識(shí)到：javascript是一種原型化的(prototypical)語(yǔ)言，它缺少oo自身帶來的多種便利。

  　　幾乎每位在開發(fā)javascript時(shí)嘗試應(yīng)用面向?qū)ο蠹夹g(shù)的開發(fā)者，或多或少都會(huì)問自己一個(gè)問題：“如何調(diào)用父類(super class)的方法?”在ajax技術(shù)還沒有目前這樣炙手可熱之前，這種問題很少出現(xiàn)，因?yàn)榇蠖鄶?shù)開發(fā)者僅在進(jìn)行客戶端form驗(yàn)證或者簡(jiǎn)單的dhtml/dom操作時(shí)使用javascript。在那些簡(jiǎn)單的解決方案中，函數(shù)式編程(functional programming)是很有意義的，面向?qū)ο缶幊虅t處在次之重要的位置。

  　　現(xiàn)在，ajax技術(shù)發(fā)展勢(shì)頭迅猛，開發(fā)者已經(jīng)建立了一個(gè)調(diào)用大量客戶端javascript、不斷增長(zhǎng)的、復(fù)雜的系統(tǒng)。因此，在javascript上嘗試oo技術(shù)便成為了管理復(fù)雜性的一種手段。在此過程中，多數(shù)開發(fā)者很快便認(rèn)識(shí)到：javascript是一種原型化的(prototypical)語(yǔ)言，它缺少oo自身帶來的多種便利。

  　　oo設(shè)計(jì)的主旨和關(guān)于它的一些話題談起來很大，但只著眼于class的定義方式，我認(rèn)為它是javascript開發(fā)者嘗試解決問題的首選。因此，你可以在互聯(lián)網(wǎng)上找到許多不同的問題解決案例，但在我看過它們后不免有些失望——這些案例都是在某個(gè)場(chǎng)合下適用，而不是放之四海而皆準(zhǔn)的通法。而我對(duì)這個(gè)話題的興趣來自于我的team在開發(fā) thinwire ajax framework 的影響。

  　　由于這個(gè)框架生成出對(duì)客戶端代碼的需求，才使我們“被迫”去實(shí)現(xiàn)可靠的、支持父類方法調(diào)用的oo模式。通過父類調(diào)用，你可以進(jìn)一步依靠類的繼承特性來核心化通用代碼，從而更易于減少重復(fù)代碼，去掉客戶端代碼的壞味道。

  　　下面羅列出了一些在我的研究過程中遇到的解決方式。最終，我沒有從中找出一個(gè)可以接收的解決方案，于是我不得不實(shí)現(xiàn)一個(gè)自己的解決方案，你將在本文的結(jié)尾部分看到這個(gè)方案。

  　　然而父類調(diào)用在這里是最重要的oo機(jī)制，因此我需要一個(gè)相應(yīng)的工作模式，也正是因?yàn)樵谖业挠^點(diǎn)中原型化方式是丑陋的，所以我更需要一種更加自然地使用javascript定義類的方法。

  　　more solutions：

  　　好吧，讓我們進(jìn)入討論。正如開發(fā)者所察覺的那樣，在js中實(shí)現(xiàn)基本的繼承是很容易的事，事實(shí)上有一些眾所周知的方法：

  　　丑陋的solution：

  　　沒有進(jìn)行父類調(diào)用的簡(jiǎn)單繼承:

  // 提前寫好的javascript class定義和繼承
  // 當(dāng)然，這種代碼很丑陋，散發(fā)著代碼的壞味道。
  function baseclass() {
   //baseclass constructor code goes here
  }

  baseclass.prototype.getname = function() {
   return "baseclass";
  }

  function subclass() {
   //subclass constructor code goes here
  }

  //inherit the methods of baseclass
  subclass.prototype = new baseclass();

  //override the parent's getname method
  subclass.prototype.getname = function() {
   return "subclass";
  }

  //alerts "subclass"
  alert(new subclass().getname());



  　　導(dǎo)致 ie內(nèi)存泄露的solution：

  　　這種實(shí)現(xiàn)方式能夠?qū)е略趇e中的內(nèi)存泄漏，你應(yīng)該盡量避免：

  // 運(yùn)行時(shí)的javascript class 定義和繼承
  // 看上去很傳統(tǒng)，但這些腳本會(huì)導(dǎo)致在internet explorer中的內(nèi)存泄漏.
  function baseclass() {
   this.getname = function() {
   return "baseclass";
   };

   //baseclass constructor code goes here
  }

  function subclass() {
   //在對(duì)象實(shí)例建立時(shí)重載父類的getname方法
   this.getname = function() {
   return "subclass";
   }

   //subclass constructor code goes here
  }

  //inherit the methods of baseclass
  subclass.prototype = new baseclass();

  //alerts "subclass"
  alert(new subclass().getname());



  　　就像我在第一個(gè)實(shí)現(xiàn)方法中所注釋的那樣，第一個(gè)實(shí)現(xiàn)方法有些丑陋，但它相比引起內(nèi)存泄漏的第二種方式便是首選了。

  　　我把這兩種方法放在這里的目的是指出你不應(yīng)該使用它們。

上一篇：AJAX使用技巧：如何處理書簽和翻頁(yè)按扭

下一篇：WebService服務(wù)和ajax 使用教程一例