06 年用 javascript 寫過上千行的應(yīng)用,現(xiàn)在的項目中經(jīng)常用到 javascript ,說不熟悉吧也熟悉了。說熟悉吧, javascript 的面向?qū)ο蟛糠诌€是比較陌生。實際上自己沒有系統(tǒng)學(xué)習(xí)過 javascript ,沒有完整看過一本 javascript 的書。今天決定網(wǎng)上定兩本書,一本是《 javascript 高級程序設(shè)計》《 javascript dom 編程藝術(shù)》,想著也該較系統(tǒng)的學(xué)習(xí)一下,項目中也要大量應(yīng)用到這些了,必定下一個項目我們將采用 AJAX 。總結(jié)下自己學(xué) ajax 時候補充的一點 javascript 知識。

 

一、 javascript 面向?qū)ο筇匦?/span>

 

1.       javascript 中的函數(shù)

javascript function 對象在調(diào)用過程中具有一個 arguments 屬性,它是由腳本解釋器創(chuàng)建的,這也是創(chuàng)建 arguments 唯一途徑。 Arguments 對象可以看作是一個 Array 對象,它具有 length 屬性,可以通過序號訪問每一個參數(shù)。 Arguments 有個 callee 屬性,可以獲取到執(zhí)行的 function 對象的引用。

eg

funtion f1 n

{

       if(n<=0)

{

       return 1;

}else

{

       return n*arguments.callee(n-1);// 實際同 return n*f1(n-1);

}

上例利用 callee 屬性實現(xiàn)了匿名的遞歸調(diào)用。

 

2.       apply call 方法:

apply 方法和 call 方法有形似之處,兩者都將函數(shù)綁定到其他對象上執(zhí)行。

舉例:

obj1.fun1.apply(obj2,[“test”]);

含義:是將 obj1 對象的方法 fun1 綁定到 對象 obj2 上,并使用參數(shù) test

obj1.fun1.call(obj2,“test”);

含義同上,他們區(qū)別是在 apply 參數(shù)以 array 對象傳入。而 call 是依次傳入?yún)?shù)的。

 

3.       this with

this 在對象的方法被調(diào)用時候,指代調(diào)用該方法的對象實例。

使用 with 語句時,代碼變得更加短且易讀:

沒有用 with 之前

x = obj.fun1(“a”);

y = obj.fun2(“b”);

with 之后,就變成:

with(obj)

{

x=fun1(“a”);

y=fun2(“b”);

}

4.       for in

javascript 中可以使用 for in 語句遍歷對象中所有屬性和方法。例如下面的代碼就遍歷了 test1 對象的屬性和方法,如果是屬性則輸出屬性值,如果是方法則執(zhí)行方法。

 

for(p in t)

{

       if(typeof(t[p])==”function”)

       {

              t[p]();

       }else

       {

              alert(t[p]);

       }

}

 

二、 javascript 面向?qū)ο缶幊虒崿F(xiàn)

 

       對比 java 中面向?qū)ο缶幊讨欣^承,以及封裝,多態(tài)等常見概念,進(jìn)行總結(jié)。

1.       類的聲明

首先來看下類的實現(xiàn),前面已經(jīng)使用了一種聲明類的方法。

 

function test1()

{

       this.prop1 = “prop1”;

       this.prop2 =”prop2”;

       this.fun1 = function()

{

       ……

}

}

 

上面代碼聲明了兩個公有屬性,和一個方法。大家都知道類里除了公有成員還可能還有一些私有成員變量,但是 javascript 并沒有提供相應(yīng)的機(jī)制來定義私有成員變量,不過利用一些 javascript 的小技巧就可以實現(xiàn)私有成員變量。如下:

function test1 ()

{

       var prop3 = “test”;

       this.prop1 = “prop1”;

       this.prop2 =”prop2”;

       this.fun1 = function()

{

       ……

}

}

 

上面代碼通過 var 關(guān)鍵字聲明了一個局部變量 prop3 ,其作用域是 test1 類定義的內(nèi)部,這樣就實現(xiàn)了變量私有化。

       另外在 javascript 中可以通過下面的方式聲明靜態(tài)屬性和靜態(tài)方法

       < script LANGUAGE =" JavaScript " >

    function test ( n )

    {

       

    }

    test . staticProp = " static prop test!" ;

    test . staticMechod = function ()

    {

        alert ( "adfadfd" );

    }

   

    alert ( test . staticProp );

    test . staticMechod ();

 

</ script >

實際上沒有感覺到 javascript 中靜態(tài)的必要性(不像 java ),也許是我對書本理解的不夠,或者是應(yīng)用太少。如果有讀者朋友,有不同認(rèn)識,歡迎發(fā)表看法,大家交流。

 

如果要聲明一個類的實例屬性或方法,可以使用 javascript 中對象的 prototype 屬性。例如:

test1.prototype.prop1 = “prop1”;

test1.prototype.method1 = function(){}

利用 prototype 屬性,可以實現(xiàn)另外一種類的聲明方式:

< script LANGUAGE =" JavaScript " >

    function test ()

    {}

        test . prototype =

        {

            p1 : "p1" ,

            p2 : "p2" ,

            f1 : function ()

            {

                alert ( "f1" );

            }

        }

        var te = new test ();

        te . f1 ();

</ script >

上面使用 {} 的方式聲明了一個匿名對象,大括號內(nèi)用逗號將屬性與值的列表分隔開。可以看到,采用 prototype 的方式聲明類,代碼更加簡潔明了。因此這種方式在很多 AJAX 框架中得到廣泛應(yīng)用。

 

2.       繼承

javascript 本身并沒有提供繼承,那么如何實現(xiàn)類的繼承呢?最直接大方法是復(fù)制原方法,然后在里面加入新成員。但這樣做實在是落后,因為當(dāng)原類變化,新繼承的類還要手動變化,容易出錯。而下面這種用 for in 控制的復(fù)制就不那么容易出錯了。

 

function test1()

{

       for(p in test.prototype)

       {

              test1.prototype[p] = test.prototype[p];

       }

       test1.prototype.newmethod = function()

{

           alert(“newfunction”);

}

}

 

3.       多態(tài)

多態(tài)的是實現(xiàn)可以采用和繼承類似的方法。首先定義一個抽象類,其中可以調(diào)用一些虛方法,虛方法在抽象類中沒有定義,而是通過其具體實現(xiàn)類來實現(xiàn)的。

 

< script LANGUAGE =" JavaScript " >

    // 一個繼承方法

    Object . extend = function ( destination , source )

    {

        for ( pro in source )

        {

            destination [ pro ] = source [ pro ];

        }

        return destination ;

    }

    // 一個基類

   

    function base (){}

    base . prototype =

    {

        f1 : function ()

        {

            this . oninit ();

        }

    }

    // 擴(kuò)展1

    function test1 ()

    {

       

    }

    test1 . prototype = Object . extend (

    {

        prop : "prop" ,

        oninit : function ()

        {

            alert ( this . prop );

        }

    }, base . prototype );

    // 擴(kuò)展2

    function test2 ()

    {

       

    }

    test2 . prototype = Object . extend (

    {

        prop2 : "prop2" ,

        oninit : function ()

        {

            alert ( this . prop2 );

        }

    }, base . prototype );

   

    // 測試

    var t1 = new test1 ();

    t1 . f1 ();

    var t2 = new test2 ();

    t2 . f1 ();

   

</ script >

 

posted on 2007-06-14 01