dojo/_base/declare模塊是Dojo Toolkit中創(chuàng)建類的基礎(chǔ)。declare支持多重繼承，這使得開(kāi)發(fā)者能夠編寫更加靈活的代碼并避免代碼多次重寫。Dojo.Dijit和Dojox模塊都使用declare，在這篇文章中，你就知道為什么你也要這樣做了。

準(zhǔn)備學(xué)習(xí)

在開(kāi)始學(xué)習(xí)這篇文章前，請(qǐng)確保你復(fù)習(xí)過(guò) 模塊定義 這篇文章了。

Dojo類的基本創(chuàng)建

declare函數(shù)是在dojo/_base/declare模塊中定義的，函數(shù)接受三個(gè)參數(shù)：className,superClass和properties。

ClassName

className參數(shù)代表要?jiǎng)?chuàng)建類的名稱和命名空間。命名的類都放置在全局作用域內(nèi)，className也可以通過(guò)命名空間代表繼承鏈。

命名類：

// Create a new class named "mynamespace.MyClass" declare("mynamespace.MyClass", null, {// Custom properties and methods here});

命名類mynamespace.MyClass現(xiàn)在可以在應(yīng)用的全局范圍內(nèi)使用了。

類只有在要被Dojo parser使用的情況下才能被命名，其他的類可以忽略className這一參數(shù)。

匿名類

// Create a scoped, anonymous class var MyClass = declare(null, {// Custom properties and methods here});

myClass現(xiàn)在就可以在作用域內(nèi)被使用了。

SuperClass(es)

SuperClass參數(shù)值可以為空，可以是一個(gè)類，也可以使類的集合。如果一個(gè)新類繼承至多個(gè)類，那么類集合中的第一個(gè)類是基礎(chǔ)模型，剩下的類都是混合類。

不繼承的類

var MyClass = declare(null, {// Custom properties and methods here});

null代表這個(gè)類不繼承至任何類。

一個(gè)類繼承自另一個(gè)類

var MySubClass = declare(MyClass, {// MySubClass now has all of MyClass's properties and methods// These properties and methods override parent's});

新的類MySubClass將繼承MyClass的屬性和方法。稍后我們討論如何通過(guò)第三個(gè)參數(shù)來(lái)重寫父類的屬性或方法。

繼承自多個(gè)類

var MyMultiSubClass = declare([MySubClass,MyOtherClass,MyMixinClass ],{// MyMultiSubClass now has all of the properties and methods from:// MySubClass, MyOtherClass, and MyMixinClass});

一個(gè)類數(shù)組就代表類是多重繼承，父類的屬性和方法將繼承給子類，類數(shù)組的第一個(gè)類作為子類的基礎(chǔ)模板，其他的類將混合進(jìn)去。

如果一個(gè)屬性或方法在多個(gè)父類中出現(xiàn)，那么子類將繼承最后一個(gè)類的屬性或方法。

屬性和方法對(duì)象

declare的最后一個(gè)參數(shù)是一個(gè)對(duì)象，這個(gè)對(duì)象的作用是在新類中重寫父類的同名屬性或同名方法。

自定義屬性和方法

// Class with custom properties and methods var MyClass = declare(MyParentClass, {// Any propertymyProperty1: 12,// AnothermyOtherProperty: "Hello",// A methodmyMethod: function(){// Perform any functionality herereturn result;} });

舉例：類的創(chuàng)建和繼承

以下的代碼創(chuàng)建了一個(gè)窗口小部件并繼承自dijit/form/Button：

define(["dojo/_base/declare","dijit/form/Button" ], function(declare, Button){return declare("mynamespace.Button", Button, {label: "My Button",onClick: function(evt){console.log("I was clicked!");this.inherited(arguments);}}); });

從以上的代碼片段可以得出結(jié)論：

類名叫mynamespace.Button

這個(gè)類可以在全局作用域內(nèi)，通過(guò)mynamespace.Button或者模塊的返回值被調(diào)用。

這個(gè)類繼承自dijit/form/Button。

這個(gè)類自定義了一些屬性和方法。

接下來(lái)讓我們通過(guò)構(gòu)造函數(shù)來(lái)深入學(xué)習(xí)類的創(chuàng)建。

構(gòu)造函數(shù)

　　類中最特殊的函數(shù)之一就是構(gòu)造函數(shù)。當(dāng)類初始化時(shí)，構(gòu)造函數(shù)就會(huì)被觸發(fā)并在新的對(duì)象中運(yùn)行。這就意味著this關(guān)鍵字指向的是新的實(shí)例，而不是原來(lái)的類。構(gòu)造函數(shù)也可以接受一些初始化參數(shù)。

// Create a new class var Twitter = declare(null, {// The default usernameusername: "defaultUser",// The constructorconstructor: function(args){declare.safeMixin(this,args);} });

　　創(chuàng)建一個(gè)實(shí)例

var myInstance = new Twitter();

　　在初始化實(shí)例的時(shí)候如果不指定username，那么實(shí)例將采用"defaultUser"作為實(shí)例名。為了使用safeMixin的方法，傳入一個(gè)username參數(shù)：

var myInstance = new Twitter({username: "sitepen" });

　　現(xiàn)在新的實(shí)例就用sitepen作為username了。

繼承

　　如上所述，繼承就是新的實(shí)例將復(fù)制declare的第二個(gè)參數(shù)中的父類的屬性和方法，如下所示：

// Define class A var A = declare(null, {// A few properties...propertyA: "Yes",propertyB: 2 });// Define class B var B = declare(A, {// A few properties...propertyA: "Maybe",propertyB: 1,propertyC: true });// Define class C var C = declare([mynamespace.A, mynamespace.B], {// A few properties...propertyA: "No",propertyB: 99,propertyD: false });

類的新實(shí)例的屬性如下：

// Create an instance var instance = new C();// instance.propertyA = "No" // overridden by B, then by C // instance.propertyB = 99 // overridden by B, then by C // instance.propertyC = true // kept from B // instance.propertyD = false // created by C

　　設(shè)置和重寫數(shù)字，字符串和布爾型變量是線性的。在使用數(shù)組和對(duì)象的時(shí)候就要留意它們的作用域。在return中定義的數(shù)組或?qū)ο髸?huì)被所有對(duì)象的實(shí)例所共享。在構(gòu)造函數(shù)中定義的數(shù)組和對(duì)象就只是各個(gè)實(shí)例所擁有的了。可以參考 dojo/_base/declare 獲取更多相關(guān)的信息。

this.inherited

　　盡管完全重寫方法是很有用的，但有時(shí)候一個(gè)繼承鏈上的每個(gè)構(gòu)造函數(shù)都會(huì)運(yùn)行以保護(hù)它原始的功能。這時(shí)候就是this.inherited(argumengs)申明出場(chǎng)的時(shí)候了。this.inherited(argumengs)申明會(huì)調(diào)用父類中同名方法。如下所示：

// Define class A var A = declare(null, {myMethod: function(){console.log("Hello!");} });// Define class B var B = declare(A, {myMethod: function(){// Call A's myMethodthis.inherited(arguments); // arguments provided to A's myMethodconsole.log("World!");} });// Create an instance of B var myB = new B(); myB.myMethod();// Would output: // Hello! // World!

　　this.inherited方法可以任何時(shí)候在子類的代碼中調(diào)用。有時(shí)候你需要在子類中函數(shù)的中間或尾部調(diào)用inherited()，還有，你不能再構(gòu)造函數(shù)中調(diào)用它。

結(jié)論

　　在Dojo Toolkit中declare函數(shù)式是創(chuàng)建模塊化和可重用類的關(guān)鍵。declare允許通過(guò)多個(gè)類和對(duì)個(gè)屬性方法來(lái)實(shí)現(xiàn)類的多重繼承。可喜的是，declaer是很容易學(xué)習(xí)的，它允許開(kāi)發(fā)者避免重復(fù)寫同樣的代碼。

dojo/_base/declare

　　想要進(jìn)一步學(xué)習(xí)declare和類的創(chuàng)建？那就查看下面的資源：

dojo.declare

dojo.mixin Reference Guide

Writing Your Own Widget

本系列文章翻譯至Dojo官網(wǎng)，旨在學(xué)習(xí)Dojo并提高英語(yǔ)閱讀能力，有翻譯錯(cuò)誤的地方請(qǐng)多指正！謝謝

轉(zhuǎn)載于:https://www.cnblogs.com/ruowind/archive/2013/02/04/2892055.html

總結(jié)

以上是生活随笔為你收集整理的Dojo学习笔记（三）：类化JavaScript的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。