JavaScript Academy · درس

الاستدعاءات الاختيارية والوصول بالفهرس

استخدموا التسلسل الاختياري مع الاستدعاءات والأقواس.

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

ما يتجاوز قراءة الخصائص

تتضمن السلسلة الاختيارية أيضًا صيغًا لاستدعاء الدوال والوصول بأمان إلى عناصر المصفوفات أو العناصر ذات المفاتيح الديناميكية.

const obj = { greet: () => "hi" };
console.log(obj.greet?.()); // "hi"

استدعاء الدوال اختياريًا

تستدعي الصيغة ?.() الدالة فقط إذا كانت موجودة. وإذا كانت الدالة قيمة خالية، فإنها تعيد undefined بدلًا من إلقاء خطأ.

const obj = {};
console.log(obj.greet?.()); // undefined, no error

لماذا يهم ذلك؟

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

function run(onDone) {
  onDone?.(); // safe whether or not onDone is provided
}
run();
run(() => console.log("done"));

القيم الخالية فقط تتخطى الاستدعاء

تتخطى ?.() الاستدعاء فقط عندما تكون القيمة هي null أو undefined. أما إذا كانت قيمة غير دالية، فسيظهر خطأ TypeError عند استدعائها.

const obj = { greet: 42 };
try {
  obj.greet?.();
} catch (e) {
  console.log("not a function");
}

الوصول الاختياري بالفهرس

تقرأ الصيغة ?.[ ] عنصرًا فقط إذا لم تكن القيمة الأساسية خالية، ولذلك فهي مفيدة للمصفوفات والمفاتيح المحسوبة.

const arr = ["a", "b"];
console.log(arr?.[1]); // "b"
const none = null;
console.log(none?.[0]); // undefined

المفاتيح الديناميكية

يتعامل الوصول باستخدام الأقواس المربعة مع ?. بأمان مع أسماء الخصائص الديناميكية.

const data = { user: { name: "Mia" } };
const key = "name";
console.log(data.user?.[key]); // "Mia"

المصفوفات المتداخلة

يمكنكم تسلسل الوصول الاختياري بالفهرس عبر المصفوفات أو الكائنات المتداخلة.

const grid = [[1, 2], [3, 4]];
console.log(grid?.[1]?.[0]); // 3
console.log(grid?.[5]?.[0]); // undefined

الاستدعاء الاختياري للقيمة المُعادة

يمكنكم دمج الصيغ: قراءة قيمة اختياريًا، ثم استدعاؤها اختياريًا.

const handlers = { click: () => "clicked" };
console.log(handlers.click?.()); // "clicked"
console.log(handlers.hover?.()); // undefined

الدمج مع القيم الافتراضية

ادمجوا هذه الصيغ مع ?? لمنح النتيجة قيمة بديلة.

const config = {};
const port = config.get?.() ?? 3000;
console.log(port); // 3000

استدعاء أساليب المصفوفات بأمان

تتيح لكم السلسلة الاختيارية استدعاء أسلوب على مصفوفة قد تكون مفقودة من دون إجراء فحص منفصل لوجودها.

const state = { tags: null };
console.log(state.tags?.join(", ") ?? "none"); // "none"

استخدموها عندما تكون الاختيارية حقيقية

تتألق هذه الصيغ عند التعامل مع دوال الاستدعاء اللاحقة الاختيارية وأشكال البيانات غير المؤكدة. تجنّبوا استخدامها عندما ينبغي أن تكون القيمة موجودة دائمًا، حتى تظهر الأخطاء الحقيقية.

const events = { onSave: null };
events.onSave?.("payload"); // silently does nothing
console.log("continued");

تحقّق سريع

اختاروا صيغة الاستدعاء الآمنة.

مراجعة

تتضمن السلسلة الاختيارية ?.() لاستدعاء الأساليب بأمان، و?.[ ] للوصول الآمن بالفهرس أو إلى المفاتيح الديناميكية. تعيد كلتاهما undefined عندما تكون القيمة الأساسية خالية، لكنهما تطرحان خطأً إذا جرت محاولة استدعاء قيمة غير دالية. ادمجوهما مع ?? لتوفير القيم الافتراضية، واقصروهما على القيم الاختيارية فعلًا.

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

هل درس «الاستدعاءات الاختيارية والوصول بالفهرس» مجاني؟

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

ماذا ستتعلم في «الاستدعاءات الاختيارية والوصول بالفهرس»؟

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

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

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

كم من الوقت يستغرق درس «الاستدعاءات الاختيارية والوصول بالفهرس»؟

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

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

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

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

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