如何用JavaScript定義一個(gè)類

更新時(shí)間：2014年09月12日 10:46:42 投稿：hebedich

其實(shí)Javascript中沒有類這個(gè)定義，但是有類這個(gè)概念。很多人都寫過(guò)這樣的代碼，就是一個(gè)關(guān)鍵字 function，然后定義一個(gè)方法名，方法名后緊跟一對(duì)括號(hào)。如果你在項(xiàng)目中寫過(guò)這樣的代碼，那么祝賀你，你可以不費(fèi)任何吹毛之力，就能一口氣讀完這篇文章了。

我原來(lái)的寫法都是這樣：

function Dog(){
  this.name = 'hachi';
}

Dog.prototype = {
  makeNoise:function(){
    alert('wangwangwang');
  }
};

后來(lái)又看到另外一種復(fù)雜一點(diǎn)而且看起來(lái)好像沒有必要的寫法：

function Dog(){
  var privateVariable = 'secret';

  var fn = function(){
    //...
  }

  fn.prototype = {
    makeNoise:function(){
      alert('wangwangwang');
    }
  }

  return fn;
}

這里的Dog函數(shù)其實(shí)是一個(gè) 制造類的函數(shù)，它返回了真正的Dog類。
感覺這樣做的好處是更好的實(shí)現(xiàn)了封裝。
例如這里的privateVariable就是一個(gè)私有變量：

var d = new Dog;
d.privateVariable //undefined

另外如果在第一個(gè)例子的最后加上一句：

Dog.prototype = {
  //e...WTF??
}

這樣Dog就不是Dog了~

后來(lái)的理解：
上面這樣新建類的方法直接重寫了prototype對(duì)象。這樣prototype原本內(nèi)置的屬性就沒有了(arguments, call, apply等)。
下面這種新建類的方法好像更好一些：

var Dog = function(name){
  this.name = name;
  var privateVariable = 'you cannot see me.';
  this.getPrivate = function(){return privateVariable;};
}

您可能感興趣的文章:

相關(guān)文章

一個(gè)JavaScript變量聲明的知識(shí)點(diǎn)
JavaScript變量聲明很簡(jiǎn)單，但是這里也有要學(xué)習(xí)的知識(shí)點(diǎn)，對(duì)于JavaScript基礎(chǔ)學(xué)習(xí)很重要。
2013-10-10
淺析JavaScript異步代碼優(yōu)化
這篇文章主要介紹了JavaScript異步代碼優(yōu)化，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2019-03-03
JavaScript lastIndexOf方法入門實(shí)例（計(jì)算指定字符在字符串中最后一次出現(xiàn)的位置）
這篇文章主要介紹了JavaScript字符串對(duì)象的lastIndexOf方法入門實(shí)例,lastIndexOf方法用于計(jì)算指定字符在字符串中最后一次出現(xiàn)的位置,需要的朋友可以參考下
2014-10-10
深入理解JavaScript系列（45）：代碼復(fù)用模式（避免篇）詳解
這篇文章主要介紹了深入理解JavaScript系列（45）：代碼復(fù)用模式（避免篇）詳解,本文講解了默認(rèn)模式、借用構(gòu)造函數(shù)、借用構(gòu)造函數(shù)并設(shè)置原型、共享原型、臨時(shí)構(gòu)造函數(shù)、klass等內(nèi)容,需要的朋友可以參考下
2015-03-03
JS數(shù)組(Array)處理函數(shù)整理
這篇文章主要整理了一下JS數(shù)組(Array)處理函數(shù)，常用的都匯總了一下，推薦給大家。
2014-12-12
javascript事件綁定學(xué)習(xí)要點(diǎn)
這篇文章主要介紹了javascript事件綁定學(xué)習(xí)要點(diǎn),主要包含下面四個(gè)方面1.傳統(tǒng)事件綁定的問題，2.W3C事件處理函數(shù)，3.IE事件處理函數(shù)，4.事件對(duì)象的其他補(bǔ)充，有需要的小伙伴可以參考下
2016-03-03
Javascript基礎(chǔ)教程之變量
大家都知道javascript是可以隱式聲名變量的。但要注意，隱式聲名變量總是被創(chuàng)建為全局變量?？匆韵麓a，情愿javascript語(yǔ)言強(qiáng)制聲明變量。建議大家一定要var聲明變量。
2015-01-01
EsLint入門學(xué)習(xí)教程
ESLint是一個(gè)代碼規(guī)范和錯(cuò)誤檢查工具，下面這篇文章主要介紹了EsLint的相關(guān)資料，需要的朋友可以參考學(xué)習(xí)，下面來(lái)一起看看吧。
2017-02-02
javascript編程起步（第二課）
javascript編程起步（第二課）...
2007-02-02
JS腳本defer的作用示例介紹
defer作用是文檔加載完畢了再執(zhí)行腳本,這樣回避免找不到對(duì)象的問題，下面有個(gè)不錯(cuò)的示例，感興趣的朋友可以參考下
2014-01-01