في هذه المقالة ، سنقوم بتفصيل أحد أنماط التصميم الإنشائي في JavaScript - الرابط . في هندسة البرمجيات ، يسمح لك الرابط بالإشارة إلى مجموعات من الكائنات كما لو كانت كائنات منفصلة ، مما يضمن تناسق الهيكل العام لهذه الكائنات ومجموعاتها.
تتمثل المهمة الرئيسية للرابط في دمج العديد من الكائنات في بنية شجرة واحدة . يمثل هيكل الشجرة هذا تسلسلاً هرميًا منظمًا من الخاص إلى الكل .
لفهم كيفية عمل الرابط بشكل أفضل ، تحتاج إلى فهم كيفية التسلسل الهرمي من أعمال معينة إلى أعمال كاملة وكيف يمكن تصورها.
في التسلسل الهرمي من خاص إلى الكل ، كل كائن في المجموعة هو جزء من التكوين العام . هذا التكوين العام ، بدوره ، هو مجموعة من أجزائه . تم بناء التسلسل الهرمي من الخاص إلى الكل كهيكل يشبه الشجرة ، حيث يتم إدراك ومعالجة كل "ورقة" أو "عقدة" فردية بنفس الطريقة مثل أي ورقة أو عقدة أخرى في أي جزء من الشجرة. لذا فإن مجموعة أو مجموعة كائنات (شجرة فرعية من الأوراق / العقد) هي أيضًا ورقة أو عقدة.
بصريًا ، يمكن تمثيله بشيء من هذا القبيل:
الآن بعد أن أصبح لدينا فهم أوضح للعلاقة بين الخاص والكل ، دعنا نعود إلى مصطلح الرابط... لقد حددنا أن استخدام الرابط هو دمج الكائنات المذكورة (الأوراق / العقد) في شجرة وفقًا لهذا المبدأ.
وبالتالي ، نحصل على نمط تصميم يمكن أن يتضمن فيه كل عنصر من عناصر المجموعة أيضًا مجموعات أخرى ، مما يسمح ببناء الهياكل المتداخلة بعمق.
الهيكل الداخلي
تشترك كل عقدة في الشجرة في مجموعة مشتركة من الخصائص والطرق التي تمكنها من الحفاظ على الكائنات الفردية والتفاعل معها بنفس الطريقة كما هو الحال مع مجموعات الكائنات. تفترض هذه الواجهة إنشاء خوارزميات متكررة تتكرر على جميع الكائنات في المجموعة المركبة.
أين ينطبق هذا النمط؟
في أنظمة التشغيل ، يسمح هذا النمط بالعديد من الاحتمالات ، مثل إنشاء أدلة داخل الأدلة.
الملفات (للتيسير ، يمكن اعتبار جميع الكائنات في الدليل "عناصر" ) عبارة عن أوراق / عقد (أجزاء) داخل مركب (دليل) كامل. والدليل إنشاؤها في الدليل بالمثل ورقة أو العقدة التي تضم عناصر أخرى مثل مقاطع الفيديو والصور، وما إلى ذلك وفي الوقت نفسه، الدلائل والدلائل والمركبات أيضا ، لأنها هي مجموعات من أجزاء منفصلة (كائنات والملفات، الخ إلخ.).
تستخدم المكتبات الشائعة مثل React أو Vue هذا النمط على نطاق واسع لبناء واجهات موثوقة وقابلة لإعادة الاستخدام. يتم تمثيل جميع عناصر صفحات الويب التي تراها كمكونات . كل مكون من مكونات صفحة الويب عبارة عن ورقة من شجرة ، ويمكن أن يجمع هو نفسه العديد من المكونات (في هذه الحالة ، يتم تكوين مركب ، لكنه لا يزال ورقة من شجرة ). إنها أداة قوية تبسط بشكل كبير عملية التطوير لمستخدمي المكتبة. بالإضافة إلى ذلك ، يسمح لك بإنشاء تطبيقات قابلة للتطوير تتضمن كائنات متعددة.
لماذا هذا النموذج مثير للاهتمام؟
باختصار: إنها قوية جدًا.
الرابط هو نمط تصميم قوي لأنه يسمح بمعالجة الكائن على أنه مركب باستخدام واجهة مشتركة لجميع الكائنات.
هذا يعني أنه يمكنك إعادة استخدام الأشياء دون خوف من عدم التوافق المحتمل مع الآخرين.
عند تطوير تطبيق ما ، قد تحتاج إلى العمل مع كائنات لها هيكل شجرة ، وفي هذه الحالة يمكن أن يكون استخدام هذا النمط فعالاً للغاية.
أمثلة على
لنفترض أننا نطور تطبيقًا لشركة تساعد الأطباء في الحصول على شهادة للمنصات التي تقدم خدمات الرعاية الصحية عن بُعد. تتضمن العملية جمع التواقيع للوثائق القانونية.
سنعمل مع فئة
Documentسيكون لها خاصية signatureذات قيمة افتراضية للخطأ. إذا وقع الطبيب على الوثيقة ، فسيتم تغيير قيمة التوقيع إلى توقيعه. نحدد أيضًا طريقة في هذه الفئة signتنفذ هذه الوظيفة.
هذا ما سيبدو عليه
Document:
class Document {
constructor(title) {
this.title = title
this.signature = null
}
sign(signature) {
this.signature = signature
}
}الآن ، باستخدام الرابط ، سنقدم الدعم للطرق المشابهة لتلك المحددة في
Document.
class DocumentComposite {
constructor(title) {
this.items = []
if (title) {
this.items.push(new Document(title))
}
}
add(item) {
this.items.push(item)
}
sign(signature) {
this.items.forEach((doc) => {
doc.sign(signature)
})
}
}الآن نعمة القالب تصبح واضحة. انتبه إلى آخر مقتطفين من التعليمات البرمجية: دعنا نلقي نظرة على القالب بصريًا:
رائع! يبدو أننا نسير على الطريق الصحيح. ما حصلنا عليه يتوافق مع المخطط المعروض أعلاه.
لذلك ، يحتوي هيكل الشجرة لدينا على ورقتين / عقدتين -
Documentو DocumentComposite. كلاهما يشتركان في نفس الواجهة وبالتالي يعملان كـ "أجزاء" من شجرة مركبة واحدة .
وتجدر الإشارة هنا إلى أن عقدة ورقة / الشجرة التي هي ليست مركب (
Document) هي ليست مجموعة أو مجموعة من الكائنات، وبالتالي لن يستمر المتفرعة. ومع ذلك، فإن ورقة / عقدة الوجودمركب ، يحتوي على مجموعة من الأجزاء (في حالتنا items). تذكر أيضًا أن Documentكلاهما DocumentCompositeيشتركان في واجهة مشتركة وبالتالي يشتركان في طريقة الإشارة.
إذن ما هي فعالية هذا النهج؟ على الرغم من أن DocumentComposite يستخدم واجهة واحدة لأنه يستخدم طريقة تسجيل مثل Document ، إلا أنه يتخذ نهجًا أكثر كفاءة مع استمرار تحقيق هدفه النهائي.
فبدلاً من بناء مثل هذا:
const pr2Form = new Document(
'Primary Treating Physicians Progress Report (PR2)',
)
const w2Form = new Document(' (W2)')
const forms = []
forms.push(pr2Form)
forms.push(w2Form)
forms.forEach((form) => {
form.sign('Bobby Lopez')
})يمكننا تعديل الكود وجعله أكثر كفاءة من خلال الاستفادة من الرابط:
const forms = new DocumentComposite()
const pr2Form = new Document(
' (PR2)',
)
const w2Form = new Document(' (W2)')
forms.add(pr2Form)
forms.add(w2Form)
forms.sign(' ')
console.log(forms)باستخدام هذا النهج ، نحتاج فقط إلى تنفيذ التوقيع مرة واحدة بعد إضافة جميع المستندات اللازمة ، وستقوم هذه الوظيفة بتوقيع جميع المستندات.
يمكنك التحقق من ذلك من خلال النظر إلى مخرجات الوظيفة
console.log(forms):
في المثال السابق ، كان علينا إضافة المستندات يدويًا إلى مصفوفة ، ثم تكرار كل مستند بشكل مستقل وتنفيذ الوظيفة
signللتوقيع عليها.
أيضًا ، لا تنس أن مجموعتنا
DocumentCompositeقد تتضمن مجموعة من المستندات.
لذلك عندما فعلنا هذا:
forms.add(pr2Form) //
forms.add(w2Form) // اتخذ مخططنا الشكل التالي:
لقد أضفنا شكلين ، والآن أصبح هذا المخطط مطابقًا تمامًا للأصل:
ومع ذلك ، توقفت شجرتنا عن النمو ، نظرًا لأن ورقتها الأخيرة قد شكلت ورقتين فقط ، وهو ما لا يتوافق تمامًا مع الرسم التخطيطي في لقطة الشاشة الأخيرة. إذا قمنا بدلاً من ذلك بجعل w2form مركبًا ، كما هو موضح هنا:
const forms = new DocumentComposite()
const pr2Form = new Document(
' (PR2)',
)
const w2Form = new DocumentComposite(' (W2)')
forms.add(pr2Form)
forms.add(w2Form)
forms.sign(' ')
console.log(forms)ثم يمكن أن تستمر شجرتنا في النمو:
في النهاية ، كنا سنحقق نفس الهدف - تم التوقيع على جميع الوثائق:
هذا هو المكان الذي يأتي فيه الرابط.
خاتمة
هذا كل شئ حتى الان! آمل أن تكون هذه المعلومات مفيدة لك. علاوة على ذلك!
تجدني على المتوسط
