欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

JS面向?qū)ο缶幊讨畬?duì)象使用分析

 更新時(shí)間：2010年08月19日 20:11:20   作者：  
在AJAX興起以前，很多人寫JS可以說都是毫無章法可言的，基本上是想到什么就寫什么，就是一個(gè)接一個(gè)的函數(shù)function，遇到重復(fù)的還得copy，如果一不小心函數(shù)重名了，還真不知道從何開始查找錯(cuò)誤
因?yàn)榇蠹铱偸怯妹嫦蜻^程的編程思想來寫JS代碼，而且也由于網(wǎng)絡(luò)上充斥了太多小“巧”的JS代碼段，很多都是隨意而為，很不規(guī)范，這也就造成了大家對(duì)JS的“誤解”，一味的認(rèn)為它就是一個(gè)輔助的小東東，而不適合做大的東西開發(fā)。但是自從AJAX興起后，大量的JS代碼編寫要求人們具備像寫JAVA類似的代碼一樣，能夠面向?qū)ο筮M(jìn)行開發(fā)。

所以下面就結(jié)合我自己的體會(huì)和所學(xué)習(xí)的東東和大家一起來學(xué)習(xí)在JS中如何使用面向?qū)ο蟮木幊?。其?shí)使用JS進(jìn)行面向?qū)ο箝_發(fā)也不是很難的事情，因?yàn)樵贘S中每一個(gè)function就是一個(gè)對(duì)象，比如如下一個(gè)函數(shù)：
復(fù)制代碼 代碼如下:

function HelloWorld()
{
alert('hello world!');
}

那么我們在使用的時(shí)候就可以把它當(dāng)成一個(gè)對(duì)象來使用，比如使用如下的測試函數(shù)：
復(fù)制代碼 代碼如下:

function _test()
{
var obj = new HelloWorld();
}

那么在調(diào)用_test方法后就會(huì)彈出hello world！的提示框，也就是調(diào)用了HelloWorld()對(duì)象（函數(shù)）。在這里HelloWorld這個(gè)對(duì)象沒有任何屬性和方法，它只有一個(gè)構(gòu)造方法HelloWorld()，我們可以把它想象成JAVA中的一個(gè)沒有任何屬性和方法的類，當(dāng)使用new進(jìn)行對(duì)象創(chuàng)建的時(shí)候，就調(diào)用了它的構(gòu)造方法。這也是我們最簡單的對(duì)象了，當(dāng)然了，一個(gè)對(duì)象肯定是要賦予它屬性和方法的，在JS中我們使用prototype原型關(guān)鍵字進(jìn)行賦值，比如我要給HelloWorld對(duì)象增加一個(gè)sayHello方法和一個(gè)name屬性，那么就可以這樣添加：
復(fù)制代碼 代碼如下:

HelloWorld.prototype = {
name : 'JavaScript',
sayHello : function() {
alert(this.name);
}
}

那么就可以為HelloWorld添加了一個(gè)name屬性和sayHello方法，我們再改一下_test方法，如下：
復(fù)制代碼 代碼如下:

function _test()
{
var obj = new HelloWorld();
obj.sayHello();
}

那么調(diào)用_test方法后就會(huì)先后打印hello wordl!和JavaScript（一個(gè)是構(gòu)造方法中的alert，一個(gè)是sayHello方法中的alert）。注意sayHello方法中的alert引用了this關(guān)鍵字，該關(guān)鍵字表示的就是HelloWorld對(duì)象，即默認(rèn)指向該對(duì)象，和JAVA中的this關(guān)鍵字一樣。

對(duì)于向一個(gè)對(duì)象添加實(shí)例方法和屬性，我們可以采用上述的方式，即使用prototype關(guān)鍵字進(jìn)行賦值，格式如下：

對(duì)象名稱.prototype = {
屬性一 : 屬性值,
屬性二 : 屬性值,
方法一 : function(參數(shù)列表) {
方法體;
},
方法二 : function(參數(shù)列表) {
方法體;
}
}

可以按照如上方式對(duì)一個(gè)對(duì)象進(jìn)行多個(gè)屬性和方法的定義，這樣在new一個(gè)對(duì)象后，就可以使用實(shí)例名稱.屬性或方法來獲取屬性或執(zhí)行方法了。

在上面的方法中，大家不知道發(fā)現(xiàn)沒有對(duì)象的屬性是可以直接訪問的，比如訪問HelloWorld對(duì)象的name屬性就可以使用obj.name直接獲取。這就好比我們JAVA中的公有屬性了，而且我們還可以直接對(duì)name屬性進(jìn)行賦值操作。所以現(xiàn)在有一個(gè)問題了，我們?nèi)绾谓o一個(gè)對(duì)象賦一個(gè)私有成員變量呢？那我們就可能要改一下HelloWorld類的聲明方式了，不使用prototype進(jìn)行類的屬性和方法聲明，而是直接使用內(nèi)嵌函數(shù)和屬性進(jìn)行聲明，修改的HelloWorld如下，我們命名為HelloWorld2：
復(fù)制代碼 代碼如下:

function HelloWorld2()
{
var privateProp = 'hello world 2!';
this.method = function() {
alert(privateProp);
}
}

看到HelloWorld2的類申明方式了沒？是直接在函數(shù)內(nèi)部進(jìn)行了函數(shù)嵌套申明，而且我們還設(shè)置了一個(gè)局部變量privateProp，即我們的私有成員變量，該變量只能被HelloWorld2內(nèi)部的函數(shù)進(jìn)行訪問，外部訪問是不允許的，這樣我們就可以通過使用變量的作用域來巧妙的設(shè)置類的私有變量了。我們應(yīng)用如下：
復(fù)制代碼 代碼如下:

function _test2()
{
var obj2 = new HelloWorld2();
obj2.method(); // 調(diào)用該方法將打印'hello world 2!
alert(obj2.privateProp); // 將打印undefined
}

上面所說的都是如何定義一個(gè)類，以為如何為一個(gè)類定義屬性和方法，由于采用prototype方式進(jìn)行定義清晰明了，所以一般都是使用該方式進(jìn)行類的定義，而且現(xiàn)在很多AJAX框架中都使用了類似的類聲明方式。而且類的私有成員變量卻只能在類的構(gòu)造方式中的函數(shù)進(jìn)行訪問，這樣類的prototype聲明的方法就不能訪問該私有成員變量了，而且可讀性方面也沒有prototype方式好。

好了，上面所說的都是定義一個(gè)類的實(shí)例方法和屬性。在JAVA中類有實(shí)例方法和屬性與類方法和屬性之分。所謂類屬性和方法就是該類的所有實(shí)例都只維護(hù)一份類屬性和類方法的副本，而不是每個(gè)實(shí)例都維護(hù)一套，這和實(shí)例屬性和實(shí)例方法是不一樣的。那么在JS中如何為一個(gè)類定義靜態(tài)類方法和類屬性呢？我們可以直接為類添加靜態(tài)屬性和靜態(tài)方法，比如為HelloWorld類添加一個(gè)age的靜態(tài)屬性和一個(gè)hello的靜態(tài)方法，那么聲明如下：
復(fù)制代碼 代碼如下:

HelloWorld.age = 22;
HelloWorld.hello = function() {
alert(HelloWorld.age);
}

那么這樣就為類HelloWorld聲明了靜態(tài)屬性age和靜態(tài)方法hello了。在使用的時(shí)候就直接使用類名進(jìn)行訪問了，但是不能使用實(shí)例進(jìn)行訪問，這點(diǎn)與JAVA中的是一致的，測試如下：
復(fù)制代碼 代碼如下:

function _test()
{
var obj = new HelloWorld();
obj.sayHello(); // 正確，實(shí)例方法，可以通過實(shí)例進(jìn)行訪問
HelloWorld.hello(); // 正確，靜態(tài)方法，通過類名進(jìn)行直接訪問
obj.hello(); // 錯(cuò)誤，不能通過實(shí)例訪問靜態(tài)方法。會(huì)報(bào)JS錯(cuò)誤！
}

通過以上的說明，相信大家對(duì)JS進(jìn)行面向?qū)ο缶幊逃辛艘欢ǖ牧私?，而且也一定蠢蠢欲?dòng)了吧，呵呵，大家不妨試試哦~~（注：以上代碼全部通過測試！）

相關(guān)文章

  • js限制input標(biāo)簽中只能輸入中文

    js限制input標(biāo)簽中只能輸入中文

    這篇文章主要介紹了js限制input標(biāo)簽中只能輸入中文的的相關(guān)資料,需要的朋友可以參考下
    2015-06-06
  • 微信小程序?qū)崿F(xiàn)發(fā)送短信驗(yàn)證碼倒計(jì)時(shí)

    微信小程序?qū)崿F(xiàn)發(fā)送短信驗(yàn)證碼倒計(jì)時(shí)

    這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)發(fā)送短信驗(yàn)證碼倒計(jì)時(shí)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
    2021-08-08
  • 用JS判斷對(duì)象是否為空的幾種常用方法

    用JS判斷對(duì)象是否為空的幾種常用方法

    如何判斷對(duì)象是否為空是我們在開發(fā)過程中經(jīng)常遇到的問題,今天我們將討論幾種常用的方法,以及如何在不同的場景中使用它們,接下來、一起看看吧,對(duì)你肯定有幫助
    2024-01-01
  • 一個(gè)關(guān)于JS正則匹配的踩坑記錄

    一個(gè)關(guān)于JS正則匹配的踩坑記錄

    這篇文章主要給大家介紹了一個(gè)關(guān)于JS正則匹配的踩坑記錄，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2021-04-04
  • 一文讓你快速了解JavaScript棧

    一文讓你快速了解JavaScript棧

    這篇文章主要介紹了一文讓你快速了解JavaScript棧，棧全稱為堆棧，是一種先進(jìn)后出的的數(shù)據(jù)結(jié)構(gòu)，棧中只有兩種基本操作，也就是插入和刪除，也就是入棧和出棧操作，棧只有一端可以進(jìn)行入棧和出棧操作，我們將其稱為棧頂，另一端稱其為棧底
    2022-07-07
  • 微信小程序用canvas實(shí)現(xiàn)圓形進(jìn)度條

    微信小程序用canvas實(shí)現(xiàn)圓形進(jìn)度條

    這篇文章主要為大家詳細(xì)介紹了微信小程序用canvas實(shí)現(xiàn)圓形進(jìn)度條，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
    2022-06-06
  • JS學(xué)習(xí)筆記之?dāng)?shù)組去重實(shí)現(xiàn)方法小結(jié)

    JS學(xué)習(xí)筆記之?dāng)?shù)組去重實(shí)現(xiàn)方法小結(jié)

    這篇文章主要介紹了JS學(xué)習(xí)筆記之?dāng)?shù)組去重實(shí)現(xiàn)方法,結(jié)合實(shí)例形式總結(jié)分析了javascript數(shù)組去重的5種常見實(shí)現(xiàn)方法及相關(guān)操作技巧,需要的朋友可以參考下
    2019-05-05
  • JavaScript 學(xué)習(xí)小結(jié)(適合新手參考)

    JavaScript 學(xué)習(xí)小結(jié)(適合新手參考)

    JavaScript常量又稱字面常量，是固化在程序代碼中的信息。變量的主要作用是存取數(shù)據(jù)，提供一個(gè)存取信息的容器。
    2009-07-07
  • JavaScript canvas實(shí)現(xiàn)雪花隨機(jī)動(dòng)態(tài)飄落

    JavaScript canvas實(shí)現(xiàn)雪花隨機(jī)動(dòng)態(tài)飄落

    這篇文章主要為大家詳細(xì)介紹了JavaScript canvas實(shí)現(xiàn)雪花隨機(jī)動(dòng)態(tài)飄落，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
    2020-02-02
  • JavaScript 32位整型無符號(hào)操作示例

    JavaScript 32位整型無符號(hào)操作示例

    所有整數(shù)字變量默認(rèn)都是有符號(hào)整數(shù)，JavaScript 進(jìn)行位操作時(shí)，是采用32位有符號(hào)整型，這意味著其轉(zhuǎn)換的結(jié)果也是32位有符號(hào)整型
    2013-12-12

最新評(píng)論