اقرأ في هذا المقال
- ما هو نمط التصميم البرمجي Design Pattern
- ما هي مزايا أنماط التصميم البرمجي
- ما هي أنماط التصميم البرمجي لجافا سكريبت
نمط التصميم البرمجي هو مفهوم معترف به على نطاق واسع في صناعة هندسة البرمجيات من حيث الفوائد التي يجلبها إلى مجالات إعادة استخدام التعليمات البرمجية وقابليتها للصيانة.
ما هو نمط التصميم البرمجي Design Pattern
نمط التصميم البرمجي: هو حل برمجي قابل لإعادة الاستخدام لنوع معين من المشاكل التي تحدث بشكل متكرر عند تطوير البرامج، على مدى سنوات عديدة من ممارسة تطوير البرمجيات، اكتشف الخبراء طرقًا لحل مشكلات مماثلة، وتم تمثيل هذه الحلول في أنماط التصميم، لذا:
- الأنماط هي حلول مثبتة لمشاكل تطوير البرمجيات.
- الأنماط قابلة للتطوير لأنها عادةً ما تكون منظمة ولها قواعد يجب عليك اتباعها.
- الأنماط قابلة لإعادة الاستخدام لمشاكل مماثلة.
يمكن اعتبار أنماط التصميم مخططًا مسبق الصنع يتم تطبيقه لحل مشكلة تصميم معينة، إنه ليس جزءًا نهائيًا من التعليمات البرمجية يمكن تطبيقه مباشرة على برنامجك، لكن بدلاً من ذلك، فهو يشبه إلى حد كبير قالبًا أو وصفًا يمكن أن يمنحك فكرة عن التعامل مع المشكلة وإيجاد الحلول.
ما هي مزايا أنماط التصميم البرمجي
1. صيانة قاعدة البيانات البرمجية
تساعد الأنماط في تنفيذ (DRY (Do not Repeat Yourself))، وهو المفهوم الذي يساعد على منع قاعدة التعليمات البرمجية الخاصة بك من النمو بشكل كبير وغير عملي.
2. إعادة استخدامها بسهولة
تساعد إعادة استخدام الأنماط في منع المشكلات الصغيرة الدقيقة التي يمكن أن تسبب مشكلات كبيرة في عملية تطوير التطبيق، ويعمل هذا أيضًا على تحسين قابلية قراءة الكود للمبرمجين.
3. التمكين من الاتصال الفعال
تضيف الأنماط إلى مفردات المطور، حيث يتيح ذلك للمطورين التواصل باستخدام أسماء معروفة ومفهومة جيدًا لتفاعلات البرامج، مما يجعل الاتصال أسرع.
4. تحسين مهاراتك الشيئية object-oriented skills
الآن، حتى إذا لم تواجه أيًا من هذه المشكلات مطلقًا، يمكن أن تمنحك أنماط التعلم نظرة ثاقبة حول الأساليب المختلفة لحل المشكلات باستخدام المبادئ الموجهة للكائنات (object-oriented).
ما هي أنماط التصميم البرمجي لجافا سكريبت
أنماط التصميم في (JavaScript) هي حلول قابلة لإعادة الاستخدام تُطبق على المشكلات الشائعة الحدوث في كتابة تطبيقات الويب، كما تساعد أنماط التصميم في الجمع بين خبرات العديد من المطورين لهيكلة الرموز بطريقة محسّنة تلبي المشكلات التي نبحث عن حلول لها، وتوفر المفردات الشائعة المستخدمة لوصف حلول لمشاكلنا بدلاً من وصف بناء الجملة ودلالات الكود لدينا، فيما يلي أفضل وأشهر أنماط تصميم (JavaScript):
1. نمط تصميم المنشىء constructor Design Pattern
هذه طريقة خاصة تُستخدم لتهيئة الكائنات التي تم إنشاؤها حديثًا بمجرد تخصيص الذاكرة، نظرًا لأن (JavaScript) عادةً ما يكون موجهًا للكائنات (objects)، فهو يتعامل مع الكائنات أكثر من غيره، هناك طرق لإنشاء كائنات جديدة في (JavaScript)، فيما يلي هو إحدى طرق إنشاء نمط أسلوب المنشىء:
// This creates a new empty Object
var newObject = {};
// This creates a new empty Object
var newObject = Object.create(Object.prototype);
var newObject = newObject();
للوصول إلى خصائص الوظيفة، يجب تهيئة الكائن كالتالي:
const object = new ConstructorObject();
2. نمط النموذج الأولي Prototype Pattern
يعتمد نمط النموذج على وراثة نموذجية (prototypical inheritance) حيث يتم إنشاء الكائنات لتكون بمثابة نماذج أولية لكائنات أخرى، في الواقع، يعمل هذا النمط كمخطط لكل مُنشئ كائن تم إنشاؤه، فيما يلي مثال للتوضيح على ذلك:
var myCar= {
name:”Ford”,
brake:function(){
console.log(“Stop! I am applying brakes”);
}
Panic: function (){
console.log ( “wait. how do you stop this thing?”)
}
}
// use object create to instantiate a new car
var yourCar= object.create(myCar);
//You can now see that one is a prototype of the other
console.log (your car.name);]
3. نمط تصميم الوحدة Module Design Pattern
في هذا النمط يمكنك إنشاء وظائف أو خصائص مماثلة بدون تعارضات، حيث أن هناك مرونة في إعادة تسمية الوظائف بشكل علني، الجزء المخيف من هذا هو عدم القدرة على تجاوز الوظائف التي تم إنشاؤها من البيئة الخارجية، فيما يلي مثال على ذلك:
function AnimalContainter () {
const container = [];
function addAnimal (name) {
container.push(name);
}
function getAllAnimals() {
return container;
}
function removeAnimal(name) {
const index = container.indexOf(name);
if(index < 1) {
throw new Error(‘Animal not found in container’);
}
container.splice(index, 1)
}
return {
add: addAnimal,
get: getAllAnimals,
remove: removeAnimal
}
}
const container = AnimalContainter();
container.add(‘Hen’);
container.add(‘Goat’);
container.add(‘Sheep’);
console.log(container.get()) //Array(3) [“Hen”, “Goat”, “Sheep”]
container.remove(‘Sheep’)
console.log(container.get()); //Array(2) [“Hen”, “Goat”]
4. نمط أسلوب المصنع Factory Pattern
إنه إبداع يهتم بإنشاء كائنات دون الحاجة إلى منشئ، حيث يوفر واجهة عامة لإنشاء كائنات، حيث يمكننا تحديد نوع (factory objects) المراد إنشاؤها، لذلك، نحدد فقط الكائن ويقوم المصنع بإنشاء مثيل له وإعادته إلينا لاستخدامه، انظر المثال التالي:
// Dealer A
DealerA = {};
DealerA.title = function title() {
return “Dealer A”;
};
DealerA.pay = function pay(amount) {
console.log(
`set up configuration using username: ${this.username} and password: ${
this.password
}`
);
return `Payment for service ${amount} is successful using ${this.title()}`;
};
//Dealer B
DealerB = {};
DealerB.title = function title() {
return “Dealer B”;
};
DealerB.pay = function pay(amount) {
console.log(
`set up configuration using username: ${this.username}
and password: ${this.password}`
);
return `Payment for service ${amount} is successful using ${this.title()}`;
};
//@param {*} DealerOption
//@param {*} config
function DealerFactory(DealerOption, config = {}) {
const dealer = Object.create(dealerOption);
Object.assign(dealer, config);
return dealer;
}
const dealerFactory = DealerFactory(DealerA, {
username: “user”,
password: “pass”
});
console.log(dealerFactory.title());
console.log(dealerFactory.pay(12));
const dealerFactory2 = DealerFactory(DealerB, {
username: “user2”,
password: “pass2”
});
console.log(dealerFactory2.title());
console.log(dealerFactory2.pay(50));
5. النمط المراقب Observer Pattern
يعد نمط تصميم المراقب مفيدًا في مكان تتواصل فيه الكائنات مع مجموعات أخرى من الكائنات في وقت واحد، انظر المثال التالي:
function Observer() {
this.observerContainer = [];
}
Observer.prototype.subscribe = function (element) {
this.observerContainer.push(element);
}
// the following removes an element from the container
Observer.prototype.unsubscribe = function (element) {
const elementIndex = this.observerContainer.indexOf(element);
if (elementIndex > -1) {
this.observerContainer.splice(elementIndex, 1);
}
}
/**
* we notify elements added to the container by calling
* each subscribed components added to our container
*/
Observer.prototype.notifyAll = function (element) {
this.observerContainer.forEach(function (observerElement) {
observerElement(element);
});
}
6. نمط الأمر Command Pattern
يمنحنا نمط تصميم الأوامر فرصة لإصدار أوامر من أي شيء يقوم بتنفيذ الأوامر وتفويض المسؤولية إلى كائنات مختلفة بدلاً من ذلك. يتم تقديم هذه الأوامر في تنسيق (()run و()execute) كالتالي:
(function(){
var carManager = {
//information requested
requestInfo: function( model, id ){
return “The information for ” + model + ” with ID ” + id + ” is foo bar”;
},
// now purchase the car
buyVehicle: function( model, id ){
return “You have successfully purchased Item ” + id + “, a ” + model;
},
// now arrange a viewing
arrangeViewing: function( model, id ){
return “You have successfully booked a viewing of ” + model + ” ( ” + id + ” ) “;
}
};
})();
