النموذج والعرض والمتحكّم (MVC) · خرائط ذهنية
النموذج والعرض والمتحكّم (MVC). خريطة ذهنية قابلة للتحرير تضم فروعًا ملونة وأفكارًا فرعية وروابط. توضح الخطوط المنحنية العلاقات، وتظهر الأسهم حين يكون للاتجاه معنى.
يقسّم MVC التطبيق إلى ثلاثة أجزاء بقاعدة واحدة: المتحكّم يتولّى الإدخال، والنموذج يملك الحالة والقواعد، والعرض يصيّر النموذج، ولا يمسّ العرض ولا المتحكّم الحالة مباشرة.
النموذج والعرض والمتحكّم (MVC) · خرائط ذهنية
لوحة MindMap التفاعلية لهذا الشرح — كل مسار وصف وسهم أعلاه جزء من مخطط QueryChart حقيقي يمكنك فتحه وتعديله.
كيفية قراءة الخريطة الذهنية
- ابدأ بالموضوع في المركز، ثم اتبع أحد الفروع الملونة لاستكشاف الأفكار المرتبطة به.
- توضح الخطوط المنحنية العلاقات، وتظهر الأسهم حين يكون للاتجاه معنى.
User input
يجمع هذا الفرع “User interacts with the interface”.
Controller
يجمع هذا الفرع “The controller is the traffic cop: it reads the user's action, decides what it means and tells the model what to change. It holds no state itself.”, “Controller updates the model”.
Model
يجمع هذا الفرع “The model is the single source of truth — data and the rules that govern it. Both the controller and the view read from it, which is why they never fight over state.”, “Model notifies observers of the change”.
View
يجمع هذا الفرع “The view is a projection of the model: it never changes data directly, it only asks the model and displays what it returns.”, “User sees the updated interface”.
روابط بين الفروع
المتحكّم يتولّى الإدخال؛ والنموذج يملك الحالة؛ والعرض يصيّر، ثلاث مسؤوليات وثلاثة مسارات.
لا العرض ولا المتحكّم يكتب البيانات؛ فكل التغييرات تمرّ عبر النموذج.
النموذج يُخطر المراقبين بدل أن يأمر العرض، فيستطيع نموذج واحد أن يقود عروضاً كثيرة.
هذا الفصل يجعل كل جزء قابلاً للاختبار وحده، وهو العائد الأصلي لهذا النمط.
MVC هو سلف أنماط حديثة كثيرة (MVVM وMVP والمخازن على طراز Redux)، وكلها تحافظ على الفصل نفسه.
العلاقات الرئيسية والخلاصات
- المتحكّم يتولّى الإدخال؛ والنموذج يملك الحالة؛ والعرض يصيّر، ثلاث مسؤوليات وثلاثة مسارات.
- لا العرض ولا المتحكّم يكتب البيانات؛ فكل التغييرات تمرّ عبر النموذج.
- النموذج يُخطر المراقبين بدل أن يأمر العرض، فيستطيع نموذج واحد أن يقود عروضاً كثيرة.
- هذا الفصل يجعل كل جزء قابلاً للاختبار وحده، وهو العائد الأصلي لهذا النمط.
- MVC هو سلف أنماط حديثة كثيرة (MVVM وMVP والمخازن على طراز Redux)، وكلها تحافظ على الفصل نفسه.
متى تستخدم هذا الشرح المرئي
- تقديم هذا النمط لمطوّر قبل أن يقرأ توثيق أي إطار، فالمثلث هو الخريطة التي ينفّذها كل إطار.
- شرح سبب صعوبة تغيير قاعدة شيفرة: فالحالة التي تُعالَج داخل العرض مخالفة لـMVC، وهي مرئية على اللوحة.
- مقارنة MVC بالبنى الطبقية في الشرح المرئي للبنية النظيفة.
كيف تعمل
عدّل الموضوع المركزي
غيّر اسم الموضوع ليناسب مشروعك أو درسك.
وسّع الفروع
حرر الأفكار وأضف أمثلة أو ملاحظات.
اربط الأفكار ذات الصلة
ارسم روابط بين الفروع، واستخدم الأسهم عندما يكون الاتجاه مهمًا.
الأسئلة الشائعة
ما هو MVC؟
MVC (النموذج والعرض والمتحكّم) نمط برمجي يفصل التطبيق إلى ثلاثة أجزاء: المتحكّم يتولّى الإدخال، والنموذج يملك البيانات وقواعد العمل، والعرض يصيّر النموذج. وفائدة هذا الفصل أن كل جزء يمكن تطويره واختباره بشكل مستقل، وأن النموذج نفسه يمكن أن تعرضه عروض كثيرة. وهو النمط الذي بُنيت عليه معظم أطر الويب.
لماذا يقع النموذج في مركز MVC؟
لأن النموذج هو المصدر الموثوق الوحيد. فلو استطاع كل من المتحكّم والعرض كتابة البيانات، لانحرفا وتنازعا على الحالة. وإبقاء كل التغييرات في النموذج يعني وجود مكان واحد بالضبط تسكن فيه القواعد التي تحكم البيانات، ويجعل العرض دائماً إسقاطاً لنموذج متسق. ولهذا يضع الشرح المرئي مربعي النموذج في مسار خاص بهما.
ماذا يحدث إن وضعت منطقاً داخل العرض؟
تحصل على نمط مضاد يُسمّى أحياناً «العرض السمين»: شيفرة عرض مختلطة بقواعد العمل، لا يمكن اختبارها دون تصيير، وتنحرف عن النموذج. والنقد نفسه ينطبق على متحكّم يحمل منطق عمل بدل أن يفوّضه. وانضباط MVC هو أن يبقى كل مسار في مساره، وصفوف الشرح المرئي الثلاثة المنفصلة هي هذه القاعدة وقد صارت مرئية.
ما علاقة MVC بالأطر الحديثة؟
تحافظ معظم الأطر الحديثة على المثلث بأسماء جديدة: فـMVVM يضيف طبقة نموذج-عرض، وMVP يمنح العرض عارضاً، ومكتبات إدارة الحالة مثل Redux هي في جوهرها النموذج بقاعدة إخطار أشد صرامة. وحلقة اللوحة الجوهرية (الإدخال يغيّر الحالة، والحالة تقود المخرج) هي الثابت الذي تحتفظ به كل واحدة منها.
حرر هذه الخريطة الذهنية في QueryChart
افتح الخريطة على لوحة قابلة للتحرير. انقل الأفكار وأضف فروعًا وروابط.