Java Script Design Patterns

Yleiskatsaus: Tässä asiakirjassa me puhumme eri suunnittelumalleja käytetään JavaScript. Useimmat kehittäjät ihme selvittää tarkka tai ihanteellinen Suunnittelumalli käytettäväksi niiden ohjelmaan. Ollakseni rehellinen, ei ole konkreettista vastausta tähän kysymykseen vai ei ole mitään kaavoja, jotka selvittää oikeat Suunnittelumalli käytettäväksi tietyssä tilanteessa. Joten tällaisissa seikka, meillä pitäisi olla vankka gasp suunnittelun malleja ja ne erityisongelmat, joita käsittelevät, meidän pitäisi olla paremmassa tilanteessa tehdä päätös, johon suunnittelumalli voidaan käyttää missäkin kunnossa.

Käyttöönotto:
Designkuvio on uudelleenkäytettäviä ratkaisu, jota voidaan soveltaa yhteisiin uusiutumista ongelmia ohjelmistojen suunnitteluun ja kehittämiseen. Suunnittelumalli voidaan kutsua myös malleina käytetään yhteisten ongelmien ratkaisemiseksi. Suunnittelumalleja on kolme suurta hyötyä:

Ne ovat osoittautuneet ratkaisut: Suunnittelu kuvio muodostavat vankan lähestymistapa ohjelmistokehityksen ja käyttää testattuja menetelmiä.
Voidaan helposti käyttää uudelleen: Suunnittelumalleja ovat käsitteellisiä ja tarjoavat kättelyssä ratkaisu, joka sopii tarpeisiimme. Tämä ominaisuus tekee suunnittelumalleja vakaampi ja niitä voidaan käyttää uudelleen vastaavissa olosuhteissa.
Kuviot ovat ilmeikkäät: Jokainen design kuvio esittelee ennalta määritettyihin ja sanasto, jota voidaan käyttää tarjoamaan ratkaisuja suurempiin ongelmiin.

Suunnittelumalli koskaan antaa tarkka ratkaisu ongelmaan. On tärkeää huomata, että rooli kuviot on aikaansaada ratkaisu järjestelmän.

Tyypit Design Patterns
Suunnittelumalleja voidaan jakaa seuraaviin kolmeen alakategorioita:

Creational suunnittelu Pattern : Tässä luokassa seuraavat suunnittelumalleja fall :
- Singleton
- Rakentaja
- Tehdas
- Abstrakti
- Prototyyppi
- Rakentaja
Rakennesuunnittelu Pattern : Tässä luokassa seuraavat suunnittelumalleja fall :
- Sisustusarkkitehti
- Julkisivu
- Flyweight
- sovitin
- valtakirja
Behavioral suunnittelu Pattern : Tässä luokassa seuraavat suunnittelumalli fall :
- Iterator
- Vierailija
- sovittelija
- tarkkailija

Patterns in JavaScript:
Seuraavat kuviot ovat yleisesti käytetty JavaScript:

rakentaja Pattern
moduuli Pattern
Singleton Pattern
Observer Pattern
Sovittelija Pattern
Prototype Pattern
Command Pattern
julkisivu Pattern
Factory Pattern
Decorator Pattern
kärpässarja Pattern

The Constructor Pattern:
Kuten kohti klassisen olio-ohjelmoinnin käsite, rakentaja on erityinen menetelmä, jota käytetään luoda instanssi objektin muistissa. JavaScript objekti luominen tehdään käyttämällä jotakin seuraavista kolmesta lähestymistavasta:

Listing 1: Kolme lähestymistapaa käytetään JavaScript luoda Objects

[Code]

// Lähestyä 1

oli newObject = {};

//Lähestyä 2

var newObject = Object.create(nolla);

//Lähestyä 3

var newObject = new Object();

[/Code]

Kolmannessa lähestymistavassa, Object on luotu objekti rakentaja, jossa ei arvo välitetään tai asettaa. On olemassa useita tapoja asettaa arvot vasta luotu objekti. These are:

Listing 2: Tapoja asettaa arvot rakentaja

[Code]

//Lähestyä 1

newObject.someKey = "Hello World"

//Lähestyä 2

newObject[someKey] = "Hello World"

//Lähestyä 3

Object.defineProperty( newObject, “someKey”, {

arvo : "Hei maailma"

kirjoitettavissa : totta

numeroituvat : totta

konfiguroitavissa : totta

);

[/Code]

Singleton malli:
Me kaikki tiedämme, että Singleton kuvio rajoitetaan luominen objektin kertaalleen. Singleton kuvio toteutetaan luomalla luokan menetelmällä, joka luo uuden esiintymän kohteen vain, kun muita tapauksia ole. JavaScript singletons ovat kuin yhteinen resurssi nimiavaruuden joka eristää täytäntöönpanon maailmanlaajuisesta nimiavaruuden. JavaScript, Singleton on toteutettu seuraavalla tavalla:

Listing 3: Singleton täytäntöönpano JavaScript

[Code]

oli mySingleton = (toiminto () {

// Esimerkiksi tallentaa viittaus Singleton

var esimerkiksi;

toiminto init() {

// Singleton

// Yksityiset menetelmät ja muuttujat

toiminto privateMethod(){

console.log( “Olen yksityinen” );

}

oli yksityinen muuttuja = “Im myös yksityisiä”;

var privateRandomNumber = Math.random();

return {

// Julkinen menetelmät ja muuttujat

publicMethod: toiminto () {

console.log( “Yleisö näkee minut!” );

publicProperty: “Olen myös julkiset”,

getRandomNumber: toiminto() {

palata privateRandomNumber;

}

};

return {

// Hanki Singleton esimerkiksi jos sellainen on

// tai luoda, jos se ei

getInstance: toiminto () {

jos ( !esimerkki ) {

Esimerkiksi = init();

}

palata esimerkiksi;

}

};

})();

oli myBadSingleton = (toiminto () {

// Esimerkiksi tallentaa viittaus Singleton

var esimerkiksi;

toiminto init() {

// Singleton

var privateRandomNumber = Math.random();

return {

getRandomNumber: toiminto() {

palata privateRandomNumber;

}

};

return {

// Aina luoda uusi Singleton esimerkiksi

getInstance: toiminto () {

Esimerkiksi = init();

palata esimerkiksi;

}

};

})();

// Usage:

oli single1 = mySingleton.getInstance();

oli single2 = mySingleton.getInstance();

console.log( singleA.getRandomNumber() === singleB.getRandomNumber() ); // totta

var badSingle1 = myBadSingleton.getInstance();

var badSingle2 = myBadSingleton.getInstance();

console.log( badSingleA.getRandomNumber() !== badSingleB.getRandomNumber() ); // totta

[/Code]

Kuten kohti GoF, Singleton sovelletaan seuraavissa tilanteissa:

Pitäisi olla täsmälleen esiintymän Object.
Ainoa esimerkiksi pitäisi olla laajennettavissa sub-luokittelemalla se.

Observer Pattern:
Vuonna Observer kuvio, the object (kutsutaan myös aihe) ylläpitää luetteloa esineitä riippuen se kutsutaan tarkkailijoiksi. Kohteena ilmoittaa automaattisesti tarkkailijoille muutosta, joka on tapahtunut, käyttämällä broadcast mekanismia. Toteuttaminen Observer Pattern näkyy alla.

Listing 4: Luettelo riippuvainen tarkkailijat aihe voi olla

[Code]

toiminto ObserverList(){ this.observerList = [];} ObserverList.prototype.Add = function( obj ){ return this.observerList.push( obj );}; ObserverList.prototype.Empty = function(){ this.observerList = [];}; ObserverList.prototype.Count = function(){ return this.observerList.length;}; ObserverList.prototype.Get = function( index ){ jos( index > -1 && index < this.observerList.length ){ return this.observerList[ index ]; }}; ObserverList.prototype.Insert = function( obj, index ){ var pointer = -1; jos( indeksi === 0 ){ this.observerList.unshift( obj ); pointer = index; }muuten jos( indeksi === this.observerList.length ){ this.observerList.push( obj ); pointer = index; } return pointer;}; ObserverList.prototype.IndexOf = function( obj, STARTINDEX ){ var i = startIndex, osoitin = -1; sillä aikaa( minä < this.observerList.length ){ jos( this.observerList[minä] === obj ){ pointer = i; } i ; } return pointer;}; ObserverList.prototype.RemoveAt = function( index ){ jos( indeksi === 0 ){ this.observerList.shift(); }muuten jos( indeksi === this.observerList.length -1 ){ this.observerList.pop(); }}; // Extend an object with an extensionfunction extend( extension, obj ){ varten ( var avain laajennus ){ obj[avain] = laajennus[avain]; }}

[/Code]

Listing 5: Aihe

[Code]

toiminto Aihe(){ this.observers = new ObserverList();} Subject.prototype.AddObserver = function( tarkkailija ){ this.observers.Add( tarkkailija );}; Subject.prototype.RemoveObserver = function( tarkkailija ){ this.observers.RemoveAt( this.observers.IndexOf( tarkkailija, 0 ) );}; Subject.prototype.Notify = function( konteksti ){ var observerCount = this.observers.Count(); varten(var i=0; minä < observerCount; i ){ this.observers.Get(minä).Päivittää( konteksti ); }};

[/Code]

Yllä olevassa esimerkissä, käyttämällä Observer komponentit, nyt määritellä:

Painike lisätä uusia havaittavissa valintaneliöitä sivulle
Kontrolli valintaruutu, joka toimii aihe, ilmoittamalla muiden valintaruutujen ne olisi tarkistettava
Kontin uudelle valintaruutujen lisätään

HTML koodi on alla

Listing 5: HTML-koodin

[Code]

<painike id =”addNewObserver”>Lisää uusi Observer valintaruutu</nappi><input id =”mainCheckbox” type =”valintaruutu”/><div id =”observersContainer”></div>

[/Code]

Summary: Joten tässä artikkelissa olen keskustellut yksityiskohtia JavaScript suunnittelumalleja. Suunnittelumallit ovat sovellettavissa kaikentyyppisiin kielet kuten olio java ja myös skriptikieli kuten JavaScript. Mutta on eroja, ja me olemme nähneet sen yllä olevissa esimerkeissä. Joten lopuksi keskustelua voimme sanoa, että Suunnittelumallit käytetään antamaan ratkaisun yleisesti esiintyviä ongelmia. Ja muista, että Suunnittelumallit ovat