【譯】3 ways to define a JavaScript class

本文真沒啥難點,我就是爲了檢驗我英語水平退化了沒哈哈雖然我英語原本就渣翻譯起來也像大白話。將原文看了一遍也碼完翻譯了一遍差很少一個小時,其中批註部分是本身的理解若有疏漏或誤解還請指出感激涕零吶,好比JavaScript中對於單例的理解感受定義有些模糊啊。javascript

翻譯自斯托揚·斯蒂凡諾夫的原文連接:http://www.phpied.com/3-ways-to-define-a-javascript-class/php

引言java

當涉及到語法時JavaScript是一個很是靈活的面嚮對象語言。這篇文章你能夠找到三種方式定義和實例化一個對象。即便你已經用了某個你喜歡的方式,下面的介紹幫助你去了解一些別的方式有助於你閱讀別人的代碼。數組

須要注意的是在JavaScript中沒有類的概念,可是經過 Function 能夠模擬類,JavaScript中基本一切事物皆對象,在繼承方面,對象繼承對象而不是類繼承類。app

 

1.使用 function 函數

這多是最通用的一種方法了,定義一個JavaScript function而後經過 new 關鍵字建立一個實例對象,經過這個function, this 關鍵字來給這個實例對象添加屬性和方法。下面是一個例子。this

function Apple (type) {
   this.type = type;
   this.color = "red";
   this.getInfo = getAppleInfo;
}

// anti-pattern!(反模式) keep reading...
function getAppleInfo() {
   return this.color + ' ' + this.type + ' apple';
}

這個對象實例的建立須要用Apple構造器函數,添加一些屬性而後調用一些方法,請繼續看:spa

var apple = new Apple('macintosh');
apple.color = "reddish";
alert(apple.getInfo());

  1.1.方法定義在內部prototype

在上面例子中咱們看到Apple"類"的getInfo方法分隔出來被定義爲 function getAppleInfo() 。這樣看起來工做的很好,但有一個弊端——你可能會在最後定義許多類型這樣的functions,它們都在"全局命名空間"。這意味着當你用相同的名字建立另外一個function(或者使用了其餘的庫)會產生命名衝突。爲了防止這種現象,你能夠將方法定義在構造器函數內部,就像這樣:翻譯

function Apple (type){
   this.type = type;
   this.color = "red";
   this.getInfo = function() {
      return this.color + ' ' + this.type + ' apple';
   }
}

這種語法建立實例和以前的並沒什麼區別。

  1.2.方法被添加在原型屬性上

1.1的方式中仍然存在弊端,在每一次建立新實例的時候 getInfo() 方法會被每次都添加到實例對象上。有時這可能不是你想要的,一個有效的方法添加 getInfo() 就是將其定義在構造函數的原型屬性上。

function Apple (type) {
   this.type = type;
   this.color = "red";
}

Apple.prototype.getInfo = function() {
   return this.color + ' ' + this.type + ' apple';
};

能夠與1.和1.1相同的方式使用。

 

2.使用對象自面量

在JavaScript中對象字面量是一個快速精簡的方式去定義一個對象實例或數組實例,爲了建立一個空對象你能夠:

var o = {};

來代替通用的方法:

var o = new Object();

建立數組實例你能夠:

var a = [];

來代替:

var a = new Array();

這樣的方式你能夠跳過類從而當即建立實例(object)。下面仍用先前的例子描述,此次用對象字面量的語法:

var apple = {
   type: "macintosh",
   color: "red",
   getInfo: function () {
       return this.color + ' ' + this.type + ' apple';
   }
}

這種方式你沒必要經過類建立一個實例,由於這個實例對象已經存在了,你只須要使用它就好:

apple.color = "reddish";
alert(apple.getInfo());

這種實例有時被叫作單例,在一些典型的語言好比Java,單例意味着對於某個類任什麼時候候你只能有一個單一的實例,你不能從相同的類中建立更多實例對象。但在JavaScript中這個概念是沒有意義的由於全部的對象都是從單例開始的(批註:JavaScript中最大的原生對象就是Object,它既是對象也是構造函數,它只有一個,其餘原生對象Function,Array等也是,因此JavaScript實現的是單例繼承了單例?? :),任什麼時候候均可以建立一個自面量對象)。

 

3.在函數中使用單例

第三種方式是前兩種方式的結合,你可使用函數來定義一個單例對象,這是語法:

var apple = new function() {
    this.type = "macintosh";
    this.color = "red";
    this.getInfo = function () {
       return this.color + ' ' + this.type + ' apple';
    }
}

這定義和1.1很是類似,在使用實例對象上和2類似。

apple.color = "reddish";
alert(apple.getInfo());

 new function(){...} 作了兩件事:定義了一個函數(匿名構造器)並使用 new 調用它。這可能看起來有點迷惑若是你以前沒怎麼用過的話,可是這是一個很好的選擇,當你真的須要一個構造函數而又只使用一次而且又不用給它賦名時。(批註:這種方式好像看起來好簡潔,由於給單例指定了類型,記得《高程》裏給單例指定類型叫「加強的模塊模式」,對於此例的話用法以下:

var apple = function (){
    var obj = new Apple();
    return obj; 
}();

 

總結

經過上面三種方式建立實例對象,JavaScript是沒有類的定義的,真是個神奇的語言...

相關文章
相關標籤/搜索