แนะนำ
คอมโพสิตรวมวัตถุเข้ากับโครงสร้างต้นไม้เพื่อเป็นตัวแทนลำดับชั้น "ส่วนทั้งหมด" โหมดการรวมกันทำให้ผู้ใช้สอดคล้องกับการใช้วัตถุแต่ละชิ้นและวัตถุรวม
สถานการณ์ทั่วไปรวมถึงกลไกการควบคุมใน ASP.NET (นั่นคือการควบคุมสามารถมีการควบคุมเด็กซึ่งสามารถใช้งานซ้ำเพิ่มและลบการควบคุมเด็ก) และในทำนองเดียวกันมีกลไก DOM โหนด DOM สามารถมีโหนดลูก ไม่ว่าจะเป็นโหนดพาเรนต์หรือโหนดเด็กมันมีฟังก์ชั่นทั่วไปในการเพิ่มการลบและการสำรวจโหนดลูก ดังนั้นกุญแจสำคัญในรูปแบบการรวมกันคือการมีคลาสนามธรรมซึ่งสามารถเป็นตัวแทนขององค์ประกอบเด็กและองค์ประกอบหลัก
ข้อความ
ตัวอย่างเช่นมีร้านอาหารที่มีอาหารหลากหลาย แต่ละตารางมีเมนู เมนูแสดงรายการอาหารที่ร้านอาหารเกี่ยวกับรวมถึงขนมอบอาหารเช้าอาหารกลางวันอาหารเย็น ฯลฯ อาหารแต่ละมื้อมีรายการเมนูที่หลากหลาย สมมติว่าทั้งรายการเมนูและเมนูทั้งหมดควรพิมพ์และสามารถเพิ่มรายการย่อยได้เช่นอาหารใหม่สามารถเพิ่มสำหรับมื้อกลางวันและสามารถเพิ่มน้ำตาลสำหรับรายการเมนูเช่นกาแฟ
ในกรณีนี้เราสามารถใช้ชุดค่าผสมเพื่อแสดงเนื้อหาเหล่านี้เป็นลำดับชั้น มาทำลายขั้นตอนการใช้งานของเราทีละคน
ขั้นตอนแรกคือการใช้ฟังก์ชั่น "คลาสนามธรรม" ของเรา menucomponent:
การคัดลอกรหัสมีดังนี้:
var menucomponent = function () {
-
menucomponent.prototype.getName = function () {
โยนข้อผิดพลาดใหม่ ("วิธีนี้จะต้องเขียนใหม่!");
-
menucomponent.prototype.getDescription = function () {
โยนข้อผิดพลาดใหม่ ("วิธีนี้จะต้องเขียนใหม่!");
-
menucomponent.prototype.getPrice = function () {
โยนข้อผิดพลาดใหม่ ("วิธีนี้จะต้องเขียนใหม่!");
-
menucomponent.prototype.isvegetarian = function () {
โยนข้อผิดพลาดใหม่ ("วิธีนี้จะต้องเขียนใหม่!");
-
menucomponent.prototype.print = function () {
โยนข้อผิดพลาดใหม่ ("วิธีนี้จะต้องเขียนใหม่!");
-
menucomponent.prototype.add = function () {
โยนข้อผิดพลาดใหม่ ("วิธีนี้จะต้องเขียนใหม่!");
-
menucomponent.prototype.remove = function () {
โยนข้อผิดพลาดใหม่ ("วิธีนี้จะต้องเขียนใหม่!");
-
menucomponent.prototype.getChild = function () {
โยนข้อผิดพลาดใหม่ ("วิธีนี้จะต้องเขียนใหม่!");
-
ฟังก์ชั่นนี้มีวิธีการสองประเภทหนึ่งคือการรับข้อมูลเช่นราคาชื่อ ฯลฯ และอีกวิธีหนึ่งเป็นวิธีการดำเนินงานทั่วไปเช่นการพิมพ์การเพิ่มการลบและการรับเมนูย่อย
ขั้นตอนที่สองคือการสร้างอาหารพื้นฐาน:
การคัดลอกรหัสมีดังนี้:
var menuitem = function (sname, sdescription, bvegetarian, nprice) {
menucomponent.apply (นี้);
this.sname = sname;
this.sdescription = sdescription;
this.bvegetarian = bvegetarian;
this.nprice = nPrice;
-
menuitem.prototype = menucomponent ใหม่ ();
menuitem.prototype.getName = function () {
ส่งคืนสิ่งนี้ชื่อ;
-
menuitem.prototype.getDescription = function () {
ส่งคืนสิ่งนี้ sdescription;
-
menuitem.prototype.getPrice = function () {
ส่งคืนสิ่งนี้ nprice;
-
menuitem.prototype.isvegetarian = function () {
คืนสิ่งนี้ bvegetarian;
-
menuitem.prototype.print = function () {
console.log (this.getName () + ":" + this.getDescription () + "," + this.getPrice () + "ยูโร");
-
ดังที่เห็นได้จากรหัสเราใช้วิธีการ 4 วิธีใหม่สำหรับการรับข้อมูลและวิธีการพิมพ์และไม่ได้ใช้วิธีการทำงานอื่น ๆ อีก 3 วิธีเนื่องจากอาหารพื้นฐานไม่รวมถึงวิธีเพิ่มลบและรับ sub-dishes
ขั้นตอนที่ 3: สร้างอาหาร:
การคัดลอกรหัสมีดังนี้:
var menu = function (sname, sdescription) {
menucomponent.apply (นี้);
this.amenucomponents = [];
this.sname = sname;
this.sdescription = sdescription;
this.createiterator = function () {
โยนข้อผิดพลาดใหม่ ("วิธีนี้จะต้องถูกเขียนทับ!");
-
-
menu.prototype = menucomponent ใหม่ ();
menu.prototype.add = function (omenucomponent) {
// เพิ่มแทน
this.amenucomponents.push (Omenucomponent);
-
menu.prototype.remove = function (omenucomponent) {
// ลบสารทดแทน
var amenuitems = [];
var nmenuitem = 0;
var nlenmenuitems = this.amenucomponents.length;
var oitem = null;
สำหรับ (; nmenuitem <nlenmenuitems;) {
oItem = this.amenucomponents [nmenuitem];
ถ้า (oItem! == omenucomponent) {
amenuitems.push (OITEM);
-
nmenuitem = nmenuitem + 1;
-
this.amenucomponents = amenuitems;
-
menu.prototype.getChild = function (nindex) {
// รับสิ่งทดแทนที่ระบุ
ส่งคืนสิ่งนี้ amenucomponents [Nindex];
-
menu.prototype.getName = function () {
ส่งคืนสิ่งนี้ชื่อ;
-
menu.prototype.getDescription = function () {
ส่งคืนสิ่งนี้ sdescription;
-
menu.prototype.print = function () {
// พิมพ์จานปัจจุบันและย่อยทั้งหมด
console.log (this.getName () + ":" + this.getDescription ());
console.log ("--------------------------------------------");
var nmenucomponent = 0;
var nlenmenucomponents = this.amenucomponents.length;
var omenucomponent = null;
สำหรับ (; nmenucomponent <nlenmenucomponents;) {
OMENUCOMPONENT = this.AMENUCOMPONENTS [NMENUCOMPONENTENT];
Omenucomponent.print ();
NMENUCOMPONENT = NMENUCOMPONENT + 1;
-
-
โปรดทราบว่านอกเหนือจากการใช้วิธีการเพิ่มการลบและการได้รับวิธีการพิมพ์การพิมพ์คือการพิมพ์ข้อมูลจานปัจจุบันก่อนจากนั้นวนผ่านการพิมพ์ข้อมูลย่อยทั้งหมด
ขั้นตอนที่ 4: สร้างจานที่ระบุ:
เราสามารถสร้างอาหารจานจริงได้หลายอย่างเช่นอาหารเย็นกาแฟขนมอบ ฯลฯ พวกเขาทั้งหมดใช้เมนูเป็นต้นแบบของพวกเขาและรหัสมีดังนี้:
การคัดลอกรหัสมีดังนี้:
var dinnermenu = function () {
เมนู Apply (นี่);
-
dinnermenu.prototype = เมนูใหม่ ();
var cafemenu = function () {
เมนู Apply (นี่);
-
cafemenu.prototype = เมนูใหม่ ();
var pancakehouseemenu = function () {
เมนู Apply (นี่);
-
Pancakehouseemenu.prototype = เมนูใหม่ ();
ขั้นตอนที่ 5: สร้างคอนเทนเนอร์เมนูด้านบน - หนังสือเมนู:
การคัดลอกรหัสมีดังนี้:
var mattress = function (amenus) {
this.amenus = amenus;
-
Mattress.prototype.printmenu = function () {
this.amenus.print ();
-
ฟังก์ชั่นนี้ใช้อาร์เรย์เมนูเป็นพารามิเตอร์และค่ามีวิธี PrintMenu สำหรับการพิมพ์เนื้อหาเมนูทั้งหมด
ขั้นตอนที่ 6 วิธีการโทร:
การคัดลอกรหัสมีดังนี้:
var opancakehouseemenu = เมนูใหม่ ("เมนูบ้านแพนเค้ก", "อาหารเช้า");
var odinnermenu = เมนูใหม่ ("เมนูอาหารเย็น", "อาหารกลางวัน");
var ocoffeemenu = เมนูใหม่ ("เมนูคาเฟ่", "อาหารเย็น");
var oallmenus = เมนูใหม่ ("เมนูทั้งหมด", "เมนูทั้งหมดรวมกัน");
OALLMENUS.ADD (OpancakeHouseMenu);
oallmenus.add (Odinnermenu);
Odinnermenu.add (ใหม่ menuitem ("พาสต้า", "สปาเก็ตตี้กับซอส marinara และขนมปัง sourdough ชิ้น", จริง, 3.89));
Odinnermenu.add (Ocoffeemenu);
ocoffeemenu.add (ใหม่ menuitem ("ด่วน", "กาแฟจากเครื่อง", เท็จ, 0.99));
var omatress = ที่นอนใหม่ (Oallmenus);
console.log ("-----------------------------------------");
omattress.printmenu ();
console.log ("-----------------------------------------");
นักเรียนที่คุ้นเคยกับการพัฒนาการควบคุม ASP.NET ดูคุ้นเคยหรือไม่?
สรุป
สถานการณ์การใช้งานของโหมดรวมนั้นชัดเจนมาก:
เมื่อคุณต้องการแสดงส่วนของวัตถุ - ลำดับชั้นโดยรวม
คุณต้องการให้ผู้ใช้ละเว้นความแตกต่างระหว่างวัตถุรวมและวัตถุเดียวและผู้ใช้จะใช้วัตถุทั้งหมดในโครงสร้างรวมกันอย่างสม่ำเสมอ (วิธีการ)
นอกจากนี้รูปแบบนี้มักจะใช้กับนักตกแต่ง พวกเขามักจะมีคลาสหลักทั่วไป (นั่นคือต้นแบบ) ดังนั้นการตกแต่งจะต้องรองรับส่วนประกอบส่วนประกอบด้วยการเพิ่ม, ลบและการดำเนินการ getchild