รูปแบบการออกแบบจาวาสคริปต์ รูปแบบโรงงาน

ก่อนที่จะอ่านบทความนี้ ขอแนะนำให้อ่านบทความนี้: โหมดซิงเกิลตันของรูปแบบการออกแบบจาวาสคริปต์ ท้ายที่สุดแล้ว ฉันรู้สึกว่าเป็นการดีกว่าที่จะดำเนินการทีละขั้นตอน

รูปแบบโรงงานแบ่งออกเป็นรูปแบบโรงงานแบบธรรมดาและรูปแบบโรงงานที่ซับซ้อน แบบแรกใช้คลาสเพื่อสร้างอินสแตนซ์ โดยปกติจะเป็นแบบซิงเกิลตันเพื่อกำหนดว่าคลาสใดที่ตัวแปรสมาชิกเป็นอินสแตนซ์เฉพาะ โรงงานมีอยู่ในโรงงานที่ซับซ้อน

เรามาพูดถึงโรงงานแห่งนี้โดยละเอียดผ่านตัวอย่างที่เฉพาะเจาะจงกัน

การใช้เทคโนโลยี Ajax เพื่อเริ่มต้นคำขอแบบอะซิงโครนัสถือเป็นงานทั่วไปในการพัฒนาเว็บในปัจจุบัน

1 // ใช้งาน AjaxHandler สร้างโรงงานที่ซับซ้อนเพื่อดำเนินการชุดของกระบวนการ Ajax ซึ่งมีโรงงานธรรมดาสองแห่ง
2 คือ SimpleHandler = function(){};
3
4 SimpleHandler.ต้นแบบ = {
5 //โรงงานธรรมดาแห่งแรกที่ดำเนินการสร้าง Ajax ร้องขอ และส่ง - - รอ
6 คำขอ: ฟังก์ชั่น (วิธีการ url โทรกลับ postVars) {
7 คือ xhr = this.createXhrObject();
8 xhr.onreadystatechange = ฟังก์ชั่น(){
9 ถ้า(xhr.readyState != 4) กลับ;
10 (xhr.สถานะ == 200) ?
11 //การเรียกกลับวัตถุทั่วโลกถูกกำหนดไว้เพื่อดำเนินการแอปพลิเคชันของพารามิเตอร์ส่งคืน
12 โทรกลับความสำเร็จ (xhr.responseText,xhr.responseXML):
13 โทรกลับล้มเหลว (xhr.status);
14};
15 xhr.open(วิธีการ,url,จริง);
16 if(method != "POST") postVars = null;
17 xhr.send(โพสต์วาร์ส);
18},
19 //โรงงานธรรมดาแห่งที่สองสร้างอ็อบเจ็กต์ XHR ตามสถานการณ์ที่แตกต่างกัน โดยสามารถส่งคืนอ็อบเจ็กต์ XHR ที่ถูกต้องได้ไม่ว่าสถานการณ์จะเป็นอย่างไร
20 createXhrObject:ฟังก์ชั่น(){
21 วิธี = [
22 function(){ส่งคืน XMLHttpRequest();} ใหม่,
23 function(){ส่งคืน ActiveXObject ใหม่('Msxml2.XMLHttp');},
24 function(){ส่งคืน ActiveXObject ใหม่('Microsoft.XMLHttp');}
25 ];
26 สำหรับ(var i = 0; i < 3; i++){
27 ลอง{
28 วิธี[i]();
29 }จับ(จ){
30 ดำเนินการต่อ;
31}
32 this.createXhrObject = วิธีการ [i]();
33 วิธีส่งคืน [i] ();
34}
35 โยนข้อผิดพลาดใหม่ ("ข้อผิดพลาด!");
36}
37 }
38

เมื่อเห็นเช่นนี้ โดยทั่วไปแล้วรูปแบบโรงงานจะเป็นส่วนขยายเพิ่มเติมและการประยุกต์ใช้รูปแบบเดียว ตัวอย่างข้างต้นสามารถเรียกได้ดังนี้:

1 window.onload = ฟังก์ชั่น () {
2 คือ myHandler = SimpleHandler ใหม่ ();
โทรกลับ 3 ครั้ง = {
4 ความสำเร็จ:ฟังก์ชั่น(responseText,responseXML){alert("ความสำเร็จ:" + responseXML);},
5 ความล้มเหลว: ฟังก์ชั่น (statusCode) {alert ("ความล้มเหลว" + statusCode);}
6};
7 myHandler.request('GET','innerHTML.xml',โทรกลับ);
8
9 };//แน่นอนว่าการโทรกลับจะแตกต่างกันไปขึ้นอยู่กับสถานการณ์

ด้วยการใช้รูปแบบโรงงานแทนการใช้คีย์เวิร์ดใหม่และคลาสที่เป็นรูปธรรม คุณสามารถรวมโค้ดอินสแตนซ์ทั้งหมดไว้ในที่เดียวได้

เมื่อใช้รูปแบบโรงงาน คุณสามารถสร้างคลาสพาเรนต์ที่เป็นนามธรรมได้ก่อน จากนั้นจึงสร้างวิธีการแบบโรงงานในคลาสย่อย ดังนั้นจึงเป็นการเลื่อนการสร้างอินสแตนซ์ของออบเจ็กต์สมาชิกไปเป็นคลาสย่อยเฉพาะทางมากขึ้น ซึ่งสามารถป้องกันการทำซ้ำโค้ดได้อย่างมีประสิทธิภาพ