Java Script dizajn obrazaca

Pregled: U ovom dokumentu ćemo razgovarati o različitim uzorcima dizajna koji se koriste u JavaScriptu. Većina developera pitam kako bi saznali točan ili idealnog dizajna uzorak koji će se koristiti u svom programu. Da budem iskren, ne postoji konkretan odgovor na to pitanje, ili ne postoje formule koje bi pronašli ispravnu dizajn uzorak koji se koriste u određenoj situaciji. Dakle, pod takvim okolnostima, trebamo imati čvrstu izdisaju uzoraka dizajna i specifičnim problemima oni se bave, mi bi trebao biti u boljoj situaciji donijeti odluku o kojoj design pattern koji će se koristiti u kojima stanje.

Uvođenje:
Uzorak dizajn je ponovno upotrijebiti rješenje koje se može primijeniti na zajedničkim ponovno se pojavljuju problemi u softverskog dizajna i razvoja. Dizajn obrazac također može biti nazvao kao predlošci koristiti za rješavanje zajedničkih problema. Dizajn uzorci imaju tri glavne prednosti:

Oni su dokazali rješenja: Dizajn obrazac pružiti solidnu pristup u razvoju softvera i koristi dokazane tehnike.
Može se lako ponovno upotrijebiti: Dizajn uzorci su konceptualni i pružiti out of the box rješenje koje odgovara našim potrebama. Ova značajka čini obrasci dizajn više robustan i mogu se ponovno koristiti u sličnim uvjetima.
Uzorci su ekspresivni: Svaki dizajn uzorak predstavlja prethodno definirane strukture i vokabular koji se može koristiti za pružanje rješenja za veće probleme.

Dizajn obrazac nikad daje točan rješenje problema. Važno je napomenuti da je uloga uzoraka je osigurati shemu rješenje.

Vrste dizajn obrazaca
Dizajn uzoraka mogu se podijeliti u sljedeće tri potkategorije:

Stvaralačka Dizajn Pattern : U ovoj kategoriji se sljedeći obrasci dizajn pasti :
- jedna stvar
- Graditelj
- Tvornica
- Sažetak
- Prototip
- Graditelj
Strukturni dizajn Pattern : U ovoj kategoriji se sljedeći obrasci dizajn pasti :
- Dekorater
- Fasada
- Flyweight
- Adapter
- proxy
Bihevioralna Dizajn Pattern : U ovoj kategoriji sljedeći dizajn uzorak pada :
- iterator
- posjetilac
- Posrednik
- posmatrač

Obrasci u JavaScriptu:
Slijedeći uzorci se uobičajeno koriste u JavaScriptu:

Konstruktor Uzorak
Uzorak modul
Singleton uzorak
promatrač Uzorak
posrednik Uzorak
prototip Uzorak
Naredba Uzorak
fasada Uzorak
Tvornica Uzorak
dekorater Uzorak
Flyweight Uzorak

Konstruktoru Pattern:
Kao što je po klasičnom objektno orijentiranog koncepta programiranja, konstruktor je posebna vrsta metoda koja se koristi za stvaranje instancu objekta u memoriji. U JavaScriptu stvaranje objekta se vrši pomoću bilo koje od sljedećih tri pristupa:

Listing 1: Tri pristupa koji se koriste u JavaScriptu za stvaranje objekata

[Code]

// Pristup 1

Bio newObject = {};

//Pristup 2

var newObject = Object.create(nula);

//Pristup 3

var newObject = new Object();

[/Code]

U trećem prilazu, Objekt je izrađen pomoću konstruktora objekta u kojem se prenosi ili set bez vrijednosti. Postoji više načina za postavljanje vrijednosti novih objekata. These are:

Listing 2: Načini postavljanja vrijednosti konstruktora

[Code]

//Pristup 1

newObject.someKey = "Hello World"

//Pristup 2

newObject[someKey] = "Hello World"

//Pristup 3

Object.defineProperty( newObject, “someKey”, {

vrijednost : "Pozdrav svijete"

može se pisati : istinit

enumerable : istinit

podesiv : istinit

);

[/Code]

Singleton Pattern:
Svi znamo da je Singleton uzorak ograničava stvaranje objekta na jednoj instanci. Singleton uzorak se provodi stvaranjem klasa s postupkom koji stvara novu instancu objekta samo kada ne postoje druge slučajeve. U JavaScriptu SINGL služe kao zajednički resurs imenski prostor koji se izolira provedbu od globalnog imenski prostor. u JavaScriptu, Singleton se provodi na sljedeći način:

Listing 3: Provedba Singleton u JavaScript

[Code]

Bio mySingleton = (funkcija () {

// Instanca pohranjuje pozivanje na Singleton

var instanca;

funkcija init() {

// jedna stvar

// Privatne metode i varijable

funkcija privateMethod(){

console.log( “Ja sam privatni” );

}

je privatna varijabla = “Im također privatni”;

var privateRandomNumber = math.random();

return {

// Javni metode i varijable

publicMethod: funkcija () {

console.log( “Javnost me može vidjeti!” );

publicProperty: “Ja sam također javno”,

getRandomNumber: funkcija() {

povratak privateRandomNumber;

}

};

return {

// Uzmite Singleton primjer ako postoji

// ili stvoriti jedan ako se to ne dogodi

getInstance: funkcija () {

ako ( !primjer ) {

primjer = init();

}

povratak instancu;

}

};

})();

Bio myBadSingleton = (funkcija () {

// Instanca pohranjuje pozivanje na Singleton

var instanca;

funkcija init() {

// jedna stvar

var privateRandomNumber = math.random();

return {

getRandomNumber: funkcija() {

povratak privateRandomNumber;

}

};

return {

// Uvijek stvoriti novi Singleton primjer

getInstance: funkcija () {

primjer = init();

povratak instancu;

}

};

})();

// Posjećenost:

Bio single1 = mySingleton.getInstance();

Bio single2 = mySingleton.getInstance();

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

var badSingle1 = myBadSingleton.getInstance();

var badSingle2 = myBadSingleton.getInstance();

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

[/Code]

Kao po GOF, Singleton je primjenjiv u sljedećim situacijama:

Tu bi trebao postojati točno na primjer objekta.
Jedini primjer trebao bi biti proširiva ga pod-KLASIFIKACIJA.

The Observer Pattern:
U Observer pattern, objekt (Također je pozvao kao subjekt) održava popis predmeta, ovisno o tome u tekstu promatrača. Predmet automatski obavještava promatračima bilo kakvu promjenu koja se dogodila, pomoću mehanizma emitiranja. Provedba Observer uzorak prikazan je u nastavku.

Listing 4: Popis zavisnih promatrača subjekt može imati

[Code]

funkcija 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 ){ ako( index > -1 && index < this.observerList.length ){ return this.observerList[ index ]; }}; ObserverList.prototype.Insert = function( obj, index ){ var pointer = -1; ako( indeks === 0 ){ this.observerList.unshift( obj ); pointer = index; }inače ako( Indeks === this.observerList.length ){ this.observerList.push( obj ); pointer = index; } return pointer;}; ObserverList.prototype.IndexOf = function( obj, startIndex ){ var i = startIndex, pokazivač = -1; dok( ja < this.observerList.length ){ ako( this.observerList[ja] === obj ){ pointer = i; } ja ; } return pointer;}; ObserverList.prototype.RemoveAt = function( index ){ ako( indeks === 0 ){ this.observerList.shift(); }inače ako( Indeks === this.observerList.length -1 ){ this.observerList.pop(); }}; // Extend an object with an extensionfunction extend( extension, obj ){ za ( var ključ u produžetku ){ obj[key] = proširenje[key]; }}

[/Code]

Listing 5: Predmet

[Code]

funkcija Predmet(){ this.observers = new ObserverList();} Subject.prototype.AddObserver = function( posmatrač ){ this.observers.Add( posmatrač );}; Subject.prototype.RemoveObserver = function( posmatrač ){ this.observers.RemoveAt( this.observers.IndexOf( posmatrač, 0 ) );}; Subject.prototype.Notify = function( kontekst ){ var observerCount = this.observers.Count(); za(var i=0; ja < observerCount; ja ){ this.observers.Get(ja).Ažuriraj( kontekst ); }};

[/Code]

U gornjem primjeru, korištenjem komponenti promatrač, mi sada definirati:

Gumb za dodavanje novih relevantnih okvire na stranicu
Kontrolni okvir koji će djelovati kao subjekt, obavještava druge okvire ih treba provjeriti
Spremnik za novi okvir za izbor dodaju

HTML kod je kako pod

Listing 5: HTML kod

[Code]

<Gumb id =”addNewObserver”>Dodaj novi Observer okvir</button><ulaz id =”mainCheckbox” type =”okvir”/><div id =”observersContainer”></div>

[/Code]

Summary: Dakle, u ovom članku sam razgovarao detalje o JavaScript dizajn obrazaca. Obrasci dizajn primjenjuju se na sve vrste jezika kao što su objektno orijentiranog jezika Java i skriptiranje jezik kao JavaScript. No, postoje razlike, a mi smo ga vidjeli u prethodnim primjerima. Dakle zaključiti raspravu možemo reći da se dizajn obrazaca koristiti za pružanje rješenja za najčešće javljaju problemi. I imajte na umu da dizajn uzorci su