JavaScript Academy · درس

واجهة Reflect API

مرّروا العمليات باستخدام أساليب Reflect.

الدرس 3 من 413 خطوة

واجهة Reflect API درس مجاني في JavaScript Academy على CoddyKit. هذا هو الدرس 3 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في JavaScript Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة JavaScript Academy 4 دروس في المجموع.

ما هي Reflect؟

تُعد Reflect كائنًا مدمجًا في اللغة، وتضم أساليب تنفذ العمليات منخفضة المستوى الافتراضية على الكائنات، مثل الحصول على الخصائص وتعيينها وحذفها وغير ذلك.

تحاكي أساليبها اعتراضات Proxy واحدًا لواحد، مما يجعلها الشريك المثالي لكتابة Proxies صحيحة.

Reflect.get

تقرأ Reflect.get(target, prop) خاصيةً، تمامًا مثل target[prop]، ولكن في صورة استدعاء دالة واضح.

const obj = { name: 'Ada', age: 36 };

console.log(Reflect.get(obj, 'name'));
console.log(Reflect.get(obj, 'age'));

Reflect.set

تكتب Reflect.set(target, prop, value) خاصيةً، وتعيد true أو false للإشارة إلى النجاح، تمامًا كما يتوقع اعتراض set.

const obj = {};
const ok = Reflect.set(obj, 'score', 42);

console.log(ok);
console.log(obj.score);

Reflect.has وdeleteProperty

تحاكي Reflect.has معامل in، بينما تحاكي Reflect.deleteProperty العملية delete، وكلتاهما دالتان تعيدان قيمًا منطقية.

const obj = { a: 1, b: 2 };

console.log(Reflect.has(obj, 'a'));
console.log(Reflect.deleteProperty(obj, 'b'));
console.log(Reflect.has(obj, 'b'));

Reflect.ownKeys

تعيد Reflect.ownKeys جميع مفاتيح الخصائص الخاصة بالكائن، بما فيها الرموز والخصائص غير القابلة للتعداد، ولذلك فهي أشمل من Object.keys.

const obj = { a: 1, b: 2 };
Object.defineProperty(obj, 'hidden', { value: 3, enumerable: false });

console.log(Object.keys(obj));
console.log(Reflect.ownKeys(obj));

تمرير العمليات في Proxy

تكمن القوة الحقيقية في استدعاء أسلوب Reflect المطابق داخل الاعتراض لتنفيذ السلوك الافتراضي، ثم إضافة منطقك المخصص حوله.

const proxy = new Proxy({ v: 1 }, {
  get(target, prop, receiver) {
    console.log('reading ' + prop);
    return Reflect.get(target, prop, receiver);
  }
});

console.log(proxy.v);

تمرير set بصورة صحيحة

يؤدي استخدام Reflect.set داخل اعتراض set إلى إعادة القيمة المنطقية الصحيحة تلقائيًا، لذلك لا يتعين عليك تذكر إعادة true بنفسك.

const proxy = new Proxy({}, {
  set(target, prop, value, receiver) {
    console.log('writing ' + prop);
    return Reflect.set(target, prop, value, receiver);
  }
});

proxy.x = 10;
console.log(proxy.x);

لماذا يهم receiver

يضمن تمرير receiver إلى Reflect.get وReflect.set تشغيل أدوات getter وsetter باستخدام this الصحيح، وهذا مهم عندما ترث الكائنات بعضها من بعض.

const base = { get label() { return 'id-' + this.id; } };
const proxy = new Proxy(base, {
  get(target, prop, receiver) {
    return Reflect.get(target, prop, receiver);
  }
});
const child = Object.create(proxy);
child.id = 7;
console.log(child.label);

Reflect.apply

تستدعي Reflect.apply(fn, thisArg, argsArray) دالةً باستخدام this محدد ومصفوفة من الوسائط، وهي بديل أوضح عن fn.apply.

function greet(greeting, name) {
  return greeting + ', ' + name;
}

console.log(Reflect.apply(greet, null, ['Hello', 'Ada']));

Reflect.construct

تنشئ Reflect.construct(Cls, argsArray) مثيلًا، وهي مكافئة لـ new Cls(...args)، ولكن باستخدام مصفوفة من الوسائط.

class Point {
  constructor(x, y) { this.x = x; this.y = y; }
}

const p = Reflect.construct(Point, [3, 4]);
console.log(p.x, p.y);

لماذا تهم Reflect

توفر Reflect إصدارات متوقعة بصيغة دوال من العمليات الداخلية للكائنات، وتتكامل تمامًا مع Proxies؛ إذ يمرر كل اعتراض العملية إلى أسلوب Reflect المطابق له. والنتيجة هي شيفرة Proxy صحيحة ومختصرة. ستطبق كل ذلك لاحقًا على حالات استخدام عملية.

const audited = new Proxy({ balance: 100 }, {
  set(t, p, v, r) {
    console.log(p + ': ' + t[p] + ' -> ' + v);
    return Reflect.set(t, p, v, r);
  }
});
audited.balance = 150;
console.log(audited.balance);

تحقق سريع

لماذا نستدعي Reflect.get(target, prop, receiver) داخل اعتراض get بدلًا من target[prop]؟

أجب عليها في الدرس التفاعلي

مراجعة: واجهة API المسماة Reflect

لقد تعلمت شريك Proxy:

توفر Reflect عمليات افتراضية بصيغة دوال: get وset وhas وdeleteProperty وownKeys.
تحاكي أساليبها اعتراضات Proxy واحدًا لواحد.
يحافظ تمرير العمليات عبر Reflect مع استخدام receiver على صحة الوراثة.
تستدعي Reflect.apply الدوال، وتنشئ Reflect.construct المثيلات بطريقة واضحة.

البدء مجانًا

تعلم JavaScript مع معلم ذكاء اصطناعي — مجانًا

اكتب وقم بتشغيل أكوادك الفعلية في المتصفح، واحصل على مساعدة فورية من معلم ذكاء اصطناعي متاح 24/7، واستمر من حيث توقفت على الويب أو في التطبيق.

الدورات: 59
الدروس: 200

ابدأ التعلم مجانًا عرض الدورة الكاملة

الأسئلة الشائعة

هل درس «واجهة Reflect API» مجاني؟

نعم — نص درس «واجهة Reflect API» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة JavaScript Academy، انتقل إلى CoddyKit PRO. تتضمن دورة JavaScript Academy 4 دروس في المجموع.

ماذا ستتعلم في «واجهة Reflect API»؟

مرّروا العمليات باستخدام أساليب Reflect. تتمرن على JavaScript Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.

هل أحتاج إلى خبرة سابقة لأبدأ JavaScript Academy؟

لا تُشترط خبرة سابقة. JavaScript Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 3 من أصل 4.

كم من الوقت يستغرق درس «واجهة Reflect API»؟

معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.

هل يمكنني كتابة وتشغيل أكواد في درس JavaScript Academy هذا؟

نعم. كل درس في JavaScript Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.

جميع الدروس في هذه الدورة

← العودة إلى JavaScript Academy