JAVA & XML & JAVASCRIPT & AJAX & CSS

          Web 2.0 技術(shù)儲備............

            BlogJava :: 首頁 :: 新隨筆 :: 聯(lián)系 :: 聚合  :: 管理 ::
            77 隨筆 :: 17 文章 :: 116 評論 :: 0 Trackbacks
          作者:liuruhong

          Javascript對于做過Web程序的人不應(yīng)該是陌生,初期是用來做一些簡單的FORM驗證,基本上是在玩弄一些技巧性的東西。IE 4.0引入了DHTML,同時為了對抗Netscape的Javascript,提出了自己的腳本語言JScript,除了遵循EMAC的標準之外,同時增加了許多擴展,如下要提到的OOP編程就是其中的一個,為了命且概念,我以下提到的Javascript都是Microsoft Internet Explorer 4.0以上實現(xiàn)的JScript,對于Netscape,我沒有做過太多的程序,所以一些的區(qū)別也就看出來。


          Javascript不是一個支持面向?qū)ο蟮恼Z言,更加算不上一個開發(fā)平臺,但是Javascript提供了一個非常強大的基于prototype的面向?qū)ο笳{(diào)用功能,你可以在你自己需要的地方使用他們。因此,如何使用對象?本文盡可能從Javascript面向?qū)ο髮崿F(xiàn)原理出發(fā),解析清楚它的工作模型。在了解這些模型之后,你可以在自己的腳本庫中編寫一些實現(xiàn)代碼,然后在其他地方調(diào)用。



          Javascript的語法和C++很接近,不過在類實現(xiàn)中沒有使用關(guān)鍵字Class,實現(xiàn)繼承的時候也沒有采用傳統(tǒng)的Public或者Implement等等所謂的關(guān)鍵字來標示類的實現(xiàn)。這樣的情況下,可能有就有人會問,如何編寫Javascript的Class,如何實現(xiàn)繼承。我開始也是百思不得其解,后來看了MSDN,才知道采用了prototype來實現(xiàn),包括繼承和重載,也可以通過這個關(guān)鍵字來實現(xiàn)。



          Javascript的函數(shù)很奇怪,每個都是默認實現(xiàn)了Optional的,即參數(shù)都可以可選的,function a(var1,var2,var3),在調(diào)用的過程中a(),a(value1),a(value1,value2)等等的調(diào)用都是正確的,至少在即使編譯部分可以完整通過,至于其它,只是和函數(shù)的實現(xiàn)邏輯比較相關(guān)了。

          以下就JS對于類的實現(xiàn)、繼承、重載詳細介紹其實現(xiàn)方式。

          1。實現(xiàn)

          Js類的實現(xiàn)就通過函數(shù)直接實現(xiàn)的,每個函數(shù)可以直接看成class,如下代碼

          function ClassTest1(){

          ...//implement code

          }

          var a=new ClassTest1



          function ClassTest2(var1){

          ...//implement code

          }

          var b=new ClassTest("value")

          對于類的屬性,可以通過兩種方式實現(xiàn)

          1)this."<Property or Method"的方式實現(xiàn),在類聲明函數(shù)中直接給出函數(shù)的實現(xiàn),如 this.Add=new function(strUserName,strPassword)這樣的方式調(diào)用,編寫的方式在Class Function中調(diào)用。

          2)通過ClassFunction.prototype.[FunctionName]=function(var1,var2...){//todo}這樣的方式完成調(diào)用。

          這兩種方式從目標來看是一致的,按照我個人的觀點來看,區(qū)別的只是在于實現(xiàn)方式,通過this.propertyName的方式來創(chuàng)建,Jscript自動創(chuàng)建了property或者method的入口,不過從程序的角度而言,還是使用prototype的關(guān)鍵字實現(xiàn)比較靈活。



          另外Javascript也可以和我們C++中那種嵌套聲明的方法來聲明,C++實現(xiàn)的方法如下

          Public Class ClassName:ParentClass{

          Public DataType FunctionName(){



          }

          Public Class ClassName{

          Public DataType FunctionName(){

          }

          }

          }

          在Javascript當(dāng)中,當(dāng)然不存在class這樣的關(guān)鍵字了,所以實現(xiàn)起來有點戲劇性,不過仍然為一個非常巧妙的實現(xiàn)。

          function className(){

          //Property Implement

          this.UserName="blue";

          //Method Implement

          this.Add=new function(){



          }

          //Sub Class Implement

          function SubClassName(){

          this.PropertyName="hi"

          }

          //sub class method implement

          SubClassName.prototype.Change=function{



          }

          }

          //Main Class Method Implement

          className.prototype.Delete=function(){



          }

          如上的代碼大致演示了Javascript類中屬性和方法的實現(xiàn),另外有一點比較困惑,整個class中都是public的,沒有關(guān)鍵字private之類的可以控制某些方法是否隱藏,那么在我們編寫代碼實現(xiàn)的規(guī)范中,我看國外一些程序員都是使用_functionName這樣子為函數(shù)命的方法來區(qū)分,但是在調(diào)用過程中實際還可以調(diào)用的。

          實現(xiàn)了屬性和方法,剩下的就是Event的實現(xiàn)了,我查找了許多資料,包括整個MSDN關(guān)于JScript的參考,都沒有看到一個很好的模型關(guān)于事件實現(xiàn)的,后來參考了一些站點編寫HTA(HTML Component,有空我會寫一些相關(guān)的文章)的實現(xiàn),借助于比較扭曲(我個人認為)的方法可以大致的實現(xiàn)基于事件驅(qū)動的功能。大致的思路是這樣子的:

          1).將所有的事件定義成屬性,只要簡單的聲明就可以

          2).在需要觸發(fā)事件的代碼中判斷事件屬性是否是一個函數(shù),如果是函數(shù),直接執(zhí)行函數(shù)代碼,如果是字符串,那么執(zhí)行字符串函數(shù),通過eval(str)來執(zhí)行。

          3) .在類的實例當(dāng)中注冊事件函數(shù)。

          為了簡單說明如上的思路,采用timer這樣簡單的例子來表述如上的所提到的內(nèi)容,如果只是為了簡單的實現(xiàn)timer的功能,Javascript中setInterval函數(shù)就可以滿足全部的要求,如下的代碼只是用來說明Timer的工作原理。

          //Class For Timer
          function Timer(iInterval){
          //if not set the timer interval ,then defalut set to 500ms
          this.Interval=iInterval || 500;
          this._handleInterval;
          this.TimerEvent=null
          function Start(){
          if(this.Interval!=0){
          this._handleInterval=setInterval("TimerCallBack()",this.Interval);
          }
          }
          function Start(){
          clearInterval(this._handleInterval);
          }
          function TimerCallBack(){
          if (typeof this.TimerEvent=="function"){
          this.TimerEvent();
          }
          else if(this.TimerEvent!=null && this.TimerEvent.length>0){
          eval(this.TimerEvent);
          }
          }
          }
          //Code for Instance
          var t=new Timer(3);

          //------------------------------------//

          //1.
          t.TimerEvent=function(){
          //todo
          }

          //2.
          t.TimerEvent="alert(\"hello\")";

          //3.

          t.TimerEvent=tTimerCall;

          //----------------------------------//
          t.Start();
          t.Stop();

          function tTimerCall(){



          }



          實際工作代碼是在TimerCallBack()上面實現(xiàn),事件觸發(fā)作為屬性的方式來實現(xiàn),在應(yīng)用實例中,代碼提供了三種方法去調(diào)用事件,不過在事件的回調(diào)當(dāng)中,我還沒有想到如何可以帶參數(shù),只有才各自的實現(xiàn)當(dāng)中訪問各自需要的屬性才能夠?qū)崿F(xiàn)全部的要求。



          2。繼承。

          剛采用了大篇幅的文字去介紹如何實現(xiàn)Javascript的各種實現(xiàn),也就是從邏輯上完成了一個封裝class的實現(xiàn),從某種意義上來說,class的實現(xiàn)是真正腳本編程中使用最多的部分,不過如果只是要完成如上的功能,使用VBScript來編寫更能更加清晰,畢竟VBscript提供了class關(guān)鍵字,同時提供了public 和private這兩個關(guān)鍵字,可以清晰的將公共和私有對象分離,至于事件的實現(xiàn),也可以采用類似Javascript實現(xiàn)的思路,只是對于函數(shù)的引用需要采用GetRef這個函數(shù),具體的用法可以參考scripting reference,MSDN里頭也有詳細的介紹,而Javascript強大至于在于如下要說的了,雖然具體的東西可能不多。

          如上所言,我們已經(jīng)完成了一個基本的類實現(xiàn)Timer,現(xiàn)在要做的是重新編寫這個類,我們簡單的只是想在這個類之中加入一個方法,提供當(dāng)前的系統(tǒng)時間,方法的名稱為getSystemDate,顯然如果全部重新編寫,那就失去了我這里說的意義了。先看看如下的實現(xiàn)。

          function NewTimer(iInterval){

          //call super

          this.base=Timer;

          this.base(iInterval);

          }

          NewTimer.prototype=new Timer;

          NewTimer.prototype.getSystemDate=function(){

          var dt=new Date();

          return dt.getYear()+"-"+dt.getMonth()+"-"+dt.getDay();

          }



          上述代碼實現(xiàn)了NewTimer類,從Timer繼承,Javascript沒有使用“:”或者java的public那樣類似的關(guān)鍵字,只是通過newclassname.prototype=new baseclass這樣的方法來完成,同時NewTimer實現(xiàn)了getSystemDate的方法,在NewTimer的初始化函數(shù)中,我使用了this.base=Timer,是為了引用父類的實現(xiàn),不過在對于父類其他實現(xiàn)函數(shù)的調(diào)用,到現(xiàn)在我沒有找到一個確定的方法,是否通過this.base.start()那樣來調(diào)用還是其他的,如果有誰比較清楚的,麻煩告訴我,另外在netscape的站點上,我查到有一個特殊的"__proto__"的屬性好像是對于父類的直接引用,不過具體的我也沒有嘗試過,在msdn中也沒有看到對于__proto__的支持。



          3。重載

          或許這個是OOP編程中比較復(fù)雜的地方了,在Javascript的實現(xiàn)中有點無奈,也就是通過prototype的方式來完成的,不過因為我不清楚如何調(diào)用父類的實現(xiàn)函數(shù),那么在重載中只能夠重新編寫所有的實現(xiàn)了,另外就是在實現(xiàn)中實例化一個父類,然后通過調(diào)用它來返回需要的東西。

          Javascript中所有的對象都是從Object繼承下來的,object提供了toString()的方法,也就是說如果調(diào)用alert(objInstance)這樣的過程,實際上是調(diào)用了alert(objInstance.toString())的方法,如果沒有編寫實現(xiàn),object默認的toString()都是"object object"這樣子的,在許多地方需要重載這個函數(shù)的,比如Timer,如果我們希望var ins=new Timer(5);alert(ins)調(diào)用得到的是interval的值5,那么就需要重新編寫toString()方法了

          Timer.prototype.toString=function(){ return this.Interval};

          以上代碼實現(xiàn)之后alert(ins)得到的就是5了。



          長篇累牘的說了一堆廢話,終于說玩了大致的想法,其實語言只是一個實現(xiàn)工具,重要的在于設(shè)計的思想,不妨可以考慮一下,在BITI內(nèi)部開發(fā)一個OpenSource的Project,如果是基于javascript的模型來建立開發(fā)平臺庫,我希望有人可以參與。通過javascript建立一系列基于Web UI的控件,目前我在開發(fā)過程中也是立足于上述的想法。另外,附上我去年寫的類似HotMail的按鈕那樣的class源程序,暫時還沒有使用Image Preload,希望有人可以幫我修改一下,如果需要可以運行的版本,給我發(fā)送Email:liuruhong@263.net。另外有空我會寫基于Javascript的組件編程和多媒體編程部分,再下來就是XML方面了,希望大家共同進步。
          posted on 2006-03-16 18:01 Web 2.0 技術(shù)資源 閱讀(191) 評論(0)  編輯  收藏 所屬分類: Javascript
          主站蜘蛛池模板: 黔南| 镇宁| 湟源县| 蓬安县| 永春县| 麻城市| 章丘市| 云梦县| 牙克石市| 大丰市| 偏关县| 墨玉县| 大悟县| 灵武市| 乌鲁木齐市| 汝州市| 灵石县| 三穗县| 奈曼旗| 宣汉县| 怀远县| 喀喇| 克东县| 虹口区| 汝阳县| 乐安县| 合川市| 汉中市| 黄龙县| 台南县| 海原县| 长宁县| 遵义县| 方城县| 开封市| 沈阳市| 改则县| 海伦市| 韩城市| 绥化市| 嘉峪关市|