Java Script Դիզայն ձեւերը
Overview: Այս փաստաթղթում մենք կխոսենք տարբեր նախագծային նախշերով օգտագործվող JavaScript. Մեծ մասը մշակողների զարմանում պարզել ճշգրիտ կամ իդեալական դիզայնի օրինակին կարող է օգտագործվել իրենց ծրագրին. Անկեղծ ասած, չկա կոնկրետ պատասխան այս հարցի, թե չկան բանաձեւեր, որոնք պարզել ճիշտ դիզայնի օրինաչափություն է, որոնք օգտագործվում են տվյալ իրավիճակում. Այնպես որ, համաձայն նման պարագայում, մենք պետք է ամուր կկողմնորոշվեն նախագծային հրահանգների ու կոնկրետ խնդիրների, նրանք զբաղվել, Մենք պետք է ավելի լավ վիճակում է, որոշում է կայացնում, որի վրա դիզայն օրինակը պետք է օգտագործվում, որոնց վիճակը.
Ներածություն:
A դիզայն օրինակը է Նոր լուծում, որը կարող է կիրառվել ընդհանուր կրկին տեղի խնդիրների ծրագրային ապահովման նախագծման եւ զարգացման. Դիզայն օրինակը կարող է նաեւ termed որպես կաղապարներ օգտագործվել է լուծել ընդհանուր խնդիրները. Design նախշերով ունեն երեք հիմնական օգուտները:
- Նրանք են ապացուցված լուծումներ: Դիզայն օրինաչափություն ամուր մոտեցում ծրագրային ապահովման զարգացման եւ օգտագործում ապացուցված տեխնիկան.
- Կարող է հեշտությամբ reused: Նախագծման նախշերով են հայեցակարգային եւ ապահովել դուրս Ամենայուրօրինակ լուծում, որը ձեռնտու է մեր կարիքների. Այս առանձնահատկությունն է նախագծման նախշերով ավելի առողջ, եւ նրանք կարող են կրկին օգտագործվել է համանման պայմաններում.
- Նախշերով են արտահայտիչ: Ամեն դիզայն օրինակը ներկայացնում է predefined շարք կառուցվածքը եւ բառապաշարը, որոնք կարող են օգտագործվել է ապահովել լուծումներ խոշոր խնդիրների.
Դիզայն օրինաչափություն երբեք ապահովում է ճշգրիտ լուծում է մի խնդրի. Դա կարեւոր է նշել, որ դերը նախշերով է լուծում սխեման.
Տեսակները Դիզայն նախշերով
Նախագծման նախշերով կարող է բաժանել հետեւյալ երեք ենթաօրենսդրական կարգեր:
- Ստեղծագործական Դիզայն Pattern : Այս կատեգորիայում է հետեւյալ նախագծման նախշերով ընկնում :
- Singleton
- Շինարար
- գործարան
- վերացական
- նախատիպը
- շինարար
- Կառուցվածքների Նախագծում Pattern : Այս կատեգորիայում է հետեւյալ նախագծման նախշերով ընկնում :
- գեղազարդիչ
- ճակատ
- Վարկածներով
- ադապտեր
- փոխանորդ
- Վարքային Դիզայն Pattern : Այս կատեգորիայի հետեւյալը դիզայն օրինակը աշնանային :
- կրկնիչը
- այցելու
- Հաշտարար
- դիտորդ
Օրինաչափություններ JavaScript:
Հետեւյալ նախշերով են սովորաբար օգտագործվում է JavaScript:
- կոնստրուկտոր Pattern
- Մոդուլ Pattern
- Singleton Pattern
- Observer Pattern
- Հաշտարար Pattern
- նախատիպը Pattern
- Հրահանգ Pattern
- ֆասադային Pattern
- Factory Pattern
- գեղազարդիչ Pattern
- վարկածներով աշխարհի Pattern
The շինարար Pattern:
Ըստ դասական object oriented programming հայեցակարգին, շինարար է հատուկ տեսակ մեթոդի որն օգտագործվում է ստեղծել օրինակը առարկայի `ի հիշատակ. Ի JavaScript օբյեկտ ստեղծումը արվում օգտագործելով ցանկացած է հետեւյալ երեք մոտեցումներից:
Listing 1: Երեք մոտեցումները, որոնք օգտագործվում են JavaScript է ստեղծել Օբեկտներ
[Code]
// մոտեցում 1
էր newObject = {};
//մոտեցում 2
var newObject = Object.create(զրո);
//մոտեցում 3
var newObject = նոր օբյեկտ();
[/Code]
Է երրորդ մոտեցման, ՕԲՅԵԿՏԸ ստեղծվել օգտագործելով օբյեկտային շինարար, որտեղ ոչ մի արժեք չի անցել, կամ սահմանել. Կան մի քանի ուղիներ է սահմանված արժեքները նորաստեղծ օբյեկտ. These are:
Listing 2: Եղանակներ սահմանված արժեքները կոնստրուկտոր
[Code]
//մոտեցում 1
newObject.someKey = "Hello World»
//մոտեցում 2
newObject[someKey] = «Բարեւ աշխարհ»
//մոտեցում 3
| Object.defineProperty( newObject, “someKey”, {
արժեք : "Բարեւ, աշխարհ" գրելի : ճիշտ հաշվելի : ճիշտ կոնֆիգուրացվող : ճիշտ ); [/Code] |
The Singleton Pattern:
Մենք բոլորս գիտենք, որ Singleton օրինակը սահմանափակում ստեղծումը օբյեկտ մեկ օրինակ. Singleton օրինակը իրականացվում է ստեղծել դաս է մեթոդի, որը ստեղծում է մի նոր օրինակ օբյեկտի, միայն այն ժամանակ, երբ ոչ մի այլ դեպքեր գոյություն ունեն. Ի JavaScript singletons ծառայել որպես ընդհանուր ռեսուրսների անվանատարածքում ինչը մեկուսացնում իրականացմանը համաշխարհային անվանատարածքում. ի JavaScript, Singleton իրականացվում է հետեւյալ կարգով:
Listing 3: Singleton իրականացումը JavaScript
[Code]
էր mySingleton = (ֆունկցիա () {
// Ատյանը պահում է հղում դեպի Singleton
var ատյանի;
գործառույթը Init() {
// Singleton
// Մասնավոր մեթոդները եւ փոփոխականներ
գործառույթը privateMethod(){
console.log( “Ես մասնավոր” );
}
էր մասնավոր փոփոխական = “Im նաեւ մասնավոր”;
var privateRandomNumber = Math.random();
return {
// Հասարակայնության մեթոդները եւ փոփոխականներ
publicMethod: ֆունկցիա () {
console.log( “Հասարակությունը կարող է տեսնել ինձ!” );
},
publicProperty: “Ես նաեւ հասարակական”,
getRandomNumber: ֆունկցիա() {
վերադառնալ privateRandomNumber;
}
};
};
return {
// Ստանալ Singleton Օրինակ, եթե այդպիսին գոյություն ունի
// կամ ստեղծել մեկը, եթե դա չի
getInstance: ֆունկցիա () {
եթե ( !օրինակ ) {
ատյանի = Init();
}
վերադառնալ օրինակ;
}
};
})();
էր myBadSingleton = (ֆունկցիա () {
// Ատյանը պահում է հղում դեպի Singleton
var ատյանի;
գործառույթը Init() {
// Singleton
var privateRandomNumber = Math.random();
return {
getRandomNumber: ֆունկցիա() {
վերադառնալ privateRandomNumber;
}
};
};
return {
// Միշտ ստեղծել նոր Singleton ատյանի
getInstance: ֆունկցիա () {
ատյանի = Init();
վերադառնալ օրինակ;
}
};
})();
// օգտագործում:
էր single1 = mySingleton.getInstance();
էր single2 = mySingleton.getInstance();
console.log( singleA.getRandomNumber() === singleB.getRandomNumber() ); // ճիշտ
var badSingle1 = myBadSingleton.getInstance();
var badSingle2 = myBadSingleton.getInstance();
console.log( badSingleA.getRandomNumber() !== badSingleB.getRandomNumber() ); // ճիշտ
[/Code]
Ըստ GOF, Singleton կիրառելի է հետեւյալ իրավիճակներում:
- Այնտեղ պետք է լինի հենց ատյանի օբյեկտի.
- Միանձնյա ատյանի պետք է լինի ճկուն է Sub-որակելու այն.
The Observer Pattern:
Ի Observer օրինակին, օբյեկտ (նաեւ կոչվում է որպես սուբյեկտ) պահպանում ցուցակը օբյեկտների, կախված դրա կոչվում է որպես դիտորդ. Առարկան ինքնաբերաբար տեղեկացնում է դիտորդների որեւէ փոփոխություն, որը տեղի է ունեցել, օգտագործելով հեռարձակման մեխանիզմը. Իրականացումը Observer օրինակը ցույց է տրված ստորեւ.
Listing 4: Ցանկ կախյալ դիտորդների սուբյեկտ կարող է ունենալ
[Code]
գործառույթը 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( ինդեքս ){ եթե( ինդեքս > -1 && ինդեքս < this.observerList.length ){ return this.observerList[ ինդեքս ]; }}; ObserverList.prototype.Insert = function( OBJ, ինդեքս ){ var pointer = -1; եթե( ինդեքս === 0 ){ this.observerList.unshift( OBJ ); pointer = index; }էլ, եթե( ինդեքս === this.observerList.length ){ this.observerList.push( OBJ ); pointer = index; } return pointer;}; ObserverList.prototype.IndexOf = function( OBJ, startIndex ){ var i = startIndex, ցուցիչ = -1; ժամանակ( ես < this.observerList.length ){ եթե( this.observerList[ես] === OBJ ){ pointer = i; } i ; } return pointer;}; ObserverList.prototype.RemoveAt = function( ինդեքս ){ եթե( ինդեքս === 0 ){ this.observerList.shift(); }էլ, եթե( ինդեքս === this.observerList.length -1 ){ this.observerList.pop(); }}; // Extend an object with an extensionfunction extend( extension, OBJ ){ համար ( var բանալին է երկարաձգման ){ OBJ[key] = ընդլայնում[key]; }}
[/Code]
Listing 5: Առարկա
[Code]
գործառույթը Թեմա(){ this.observers = new ObserverList();} Subject.prototype.AddObserver = function( դիտորդ ){ this.observers.Add( դիտորդ );}; Subject.prototype.RemoveObserver = function( դիտորդ ){ this.observers.RemoveAt( this.observers.IndexOf( դիտորդ, 0 ) );}; Subject.prototype.Notify = function( կոնտեքստ ){ var observerCount = this.observers.Count(); համար(var i=0; ես < observerCount; i ){ this.observers.Get(ես).Թարմացնել( կոնտեքստ ); }};
[/Code]
Վերը նշված օրինակում, օգտագործելով դիտորդը բաղադրիչները, մենք այժմ սահմանել:
- A կոճակը ավելացնելով նոր դիտարկելի նշատուփերը էջում
- A վերահսկողություն վանդակը, որը կարող է հանդես գալ որպես սուբյեկտ, ծանուցելով մյուս նշումները, նրանք պետք է ստուգվի
- A կոնտեյներ նոր նշումները ավելացվել
The HTML կոդը ներքո
Listing 5: The HTML կոդը
[Code]
<կոճակը id =”addNewObserver”>Ավելացնել նոր դիտորդի վանդակը</կոճակ><մուտքագրում id =”mainCheckbox” type =”վանդակը”/><div id =”observersContainer”></div>
[/Code]
Summary: Այնպես որ, այս հոդվածում ես քննարկել մանրամասներ է JavaScript նախագծման նախշերով. Նախագծման նախշերով կիրառելի են բոլոր տեսակի լեզուներով նման օբյեկտ կողմնորոշված լեզվի Java եւ նաեւ scripting լեզուն նման JavaScript. Բայց կան տարբերություններ, եւ մենք տեսանք այն Բերված օրինակների. Այնպես որ, պետք է եզրակացնել, քննարկումը, մենք կարող ենք ասել, որ Դիզայն նախշերով օգտագործվում են տրամադրել լուծում հաճախ հանդիպող խնդիրները. Եւ խնդրում եմ հաշվի առնել, որ Դիզայն նախշերով են
- Արդյոք Ապացուցված լուծում
- Կարող է հեշտությամբ օգտագործվում
- Արդյոք արտահայտիչ
Հուսով եմ, որ դուք պետք է հասկանայինք հասկացությունները, եւ դա կարող է օգնել ձեզ իրականացնել այն ձեր սեփական նախագծին. Happy ընթերցում.
Ավելի հետաքրքիր հոդվածներ JS — Դուք պետք է կարդալ
