بناء الكائنات
جزء من قسم Object Oriented Programming في رحلة JavaScript على Coddy — الدرس 49 من 56.
الآن بعد أن فهمنا المشكلات المتعلقة بالوراثة العميقة وعلاقة "has-a"، دعونا نتعلم كيفية بناء الكائنات من خلال دمج مكونات صغيرة وقابلة لإعادة الاستخدام. هذا النهج يمنحنا أقصى قدر من المرونة!
النمط الأساسي:
// الخطوة 1: إنشاء مكونات صغيرة ومركزة
class Engine {
constructor(power) {
this.power = power;
}
start() {
console.log(`Engine (${this.power}HP) starting...`);
}
}
class Wheels {
constructor(count) {
this.count = count;
}
rotate() {
console.log(`${this.count} wheels rotating`);
}
}// الخطوة 2: بناء الكائنات من خلال دمج المكونات
class Car {
constructor(brand, enginePower, wheelCount) {
this.brand = brand;
this.engine = new Engine(enginePower); // يمتلك محركاً (علاقة HAS-A)
this.wheels = new Wheels(wheelCount); // يمتلك عجلات
}
drive() {
console.log(`${this.brand} is driving:`);
this.engine.start();
this.wheels.rotate();
}
}// الخطوة 3: استخدام الكائن المكون
const myCar = new Car('Toyota', 150, 4);
myCar.drive();
// المخرجات:
// Toyota is driving:
// Engine (150HP) starting...
// 4 wheels rotatingالقوة الحقيقية: دمج ومطابقة المكونات:
// مكونات أكثر تخصصاً
class TurboCharger {
boost() {
console.log('Turbo engaged! Extra power!');
}
}
class SoundSystem {
constructor(type) {
this.type = type;
}
playMusic() {
console.log(`Playing music on ${this.type} sound system`);
}
}// بناء سيارات مختلفة بمجموعات مختلفة
class SportsCar {
constructor(brand) {
this.brand = brand;
this.engine = new Engine(300);
this.wheels = new Wheels(4);
this.turbo = new TurboCharger(); // تحصل السيارة الرياضية على توربو
this.soundSystem = new SoundSystem('Premium'); // ونظام صوتي جيد
}
raceMode() {
console.log(`${this.brand} in race mode:`);
this.engine.start();
this.turbo.boost();
this.wheels.rotate();
console.log('VROOOOM!');
}
cruise() {
console.log(`${this.brand} cruising:`);
this.engine.start();
this.wheels.rotate();
this.soundSystem.playMusic();
}
}class EconomyCar {
constructor(brand) {
this.brand = brand;
this.engine = new Engine(100);
this.wheels = new Wheels(4);
// لا يوجد تيربو للسيارة الاقتصادية
this.soundSystem = new SoundSystem('Basic'); // صوت أساسي فقط
}
drive() {
console.log(`${this.brand} driving efficiently:`);
this.engine.start();
this.wheels.rotate();
this.soundSystem.playMusic();
}
}// انظر كم هو مرن هذا!
const ferrari = new SportsCar('Ferrari');
const honda = new EconomyCar('Honda');
ferrari.raceMode(); // لديه تعزيز توربو!
ferrari.cruise(); // لديه نظام صوتي متميز!
honda.drive(); // مجرد ميزات أساسيةهذا النهج يمنحك المرونة للمزج والمطابقة بين السلوكيات دون سلاسل وراثة معقدة!
التحدي
أكمل دوال SmartBulb في ملف SmartBulb.js.
- قم بتنفيذ الدالة
activate()لتشغيل الضوء. - قم بتنفيذ الدالة
adjustBrightness()لضبط السطوع وطباعة النص التالي تماماً:Brightness set to ${this.brightness.level}%
ورقة مرجعية
يمكن بناء الكائنات من خلال دمج مكونات صغيرة وقابلة لإعادة الاستخدام بدلاً من استخدام الوراثة العميقة. يُسمى هذا التركيب (composition) ويتبع علاقة "لديه-أو-يحتوي-على" (has-a).
نمط التركيب الأساسي:
// الخطوة 1: إنشاء مكونات صغيرة ومركزة
class Engine {
constructor(power) {
this.power = power;
}
start() {
console.log(`Engine (${this.power}HP) starting...`);
}
}
// الخطوة 2: بناء الكائنات من خلال دمج المكونات
class Car {
constructor(brand, enginePower) {
this.brand = brand;
this.engine = new Engine(enginePower); // لديه محرك (HAS-AN)
}
drive() {
this.engine.start();
}
}امزج وطابق المكونات من أجل المرونة:
class TurboCharger {
boost() {
console.log('Turbo engaged!');
}
}
class SportsCar {
constructor(brand) {
this.brand = brand;
this.engine = new Engine(300);
this.turbo = new TurboCharger(); // إضافة مكون التيربو
}
raceMode() {
this.engine.start();
this.turbo.boost();
}
}
class EconomyCar {
constructor(brand) {
this.brand = brand;
this.engine = new Engine(100);
// لا يوجد مكون تيربو
}
}يتيح لك التركيب بناء كائنات بمجموعات مختلفة من الميزات دون سلاسل وراثة معقدة.
جرّب بنفسك
import { SmartBulb } from './SmartBulb.js';
const bedroomLight = new SmartBulb('warm white');
console.log('1. Activating light:');
bedroomLight.activate();
console.log('\n2. Adjusting brightness:');
bedroomLight.adjustBrightness(75);
يتضمن هذا الدرس اختبارًا قصيرًا. ابدأ الدرس للإجابة عليه وتتبّع تقدمك.
جميع دروس Object Oriented Programming
1الكائنات والكلمة المفتاحية this
مراجعة سريعة: الكائناتإضافة Methods إلى الكائناتفهم الكلمة المفتاحية thisConstructor Functionsالكلمة المفتاحية newتحدي المراجعة7الوراثة والكلمة المفتاحية extends
الوراثةعلاقة "is-a"الكلمة المفتاحية extendsالدالة super()وراثة الخصائص والوظائفتحدي المراجعة2تنظيم الكود
ما هي الـ Modules؟التصدير باستخدام exportالاستيراد باستخدام importالـ Default مقابل الـ Named Exports8تنظيم كود OOP
تنظيم الـ Classes في Modules11مشروع: مصيّر الأشكال
إعداد: فئة Shape والتصديروراثة فئة Circle