JavaScript Academy · درس

التسلسل الاختياري باستخدام العامل ?.

يمكنكم الوصول بأمان إلى الخصائص المتداخلة بعمق.

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

المشكلة

تؤدي قراءة خاصية من شيء قيمته undefined أو null إلى إطلاق TypeError. يتيح التسلسل الاختياري قراءة القيم المتداخلة بأمان.

const user = {};
console.log(user.profile && user.profile.name);

المعامل ?.

يوقف معامل التسلسل الاختياري ?. التنفيذ ويعيد undefined إذا كانت القيمة الموجودة على يساره null أو undefined، بدلًا من إطلاق خطأ.

const user = {};
console.log(user.profile?.name); // undefined, no error

قراءة الخصائص العميقة

يمكنك ربط عدة خطوات من ?. للوصول إلى البنى العميقة من دون حواجز يدوية عند كل مستوى.

const data = { user: { address: { city: "Paris" } } };
console.log(data.user?.address?.city); // "Paris"

الإيقاف المبكر

إذا كانت أي حلقة في السلسلة قيمة nullish، يتوقف التعبير بأكمله ويعيد undefined، ولا يتم تقييم بقية السلسلة.

const data = { user: null };
console.log(data.user?.address?.city); // undefined

القيم Nullish وحدها تفعّله

يوقف ?. التنفيذ فقط عند وجود null أو undefined. أما القيم الزائفة الأخرى مثل 0 أو "" فهي قيم حقيقية ويتم الوصول إليها بصورة طبيعية.

const obj = { count: 0 };
console.log(obj.count?.toString()); // "0"

مقارنةً بـ &&

قبل ظهور ?.، كان المطورون يربطون حواجز &&. أما التسلسل الاختياري فهو أقصر وأوضح لتحقيق الغرض نفسه.

const u = { profile: { name: "Ada" } };
const a = u && u.profile && u.profile.name;
const b = u?.profile?.name;
console.log(a, b);

التسلسل بعد الاستدعاء

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

const config = { get: () => ({ port: 8080 }) };
console.log(config.get()?.port); // 8080

الإيقاف المبكر في منتصف السلسلة

إذا كانت إحدى الحلقات الوسطى قيمة nullish، يتوقف التقييم فورًا، حتى لو كانت الحلقات اللاحقة ستستدعي دوالًا لولا ذلك.

const obj = { a: null };
console.log(obj.a?.b.c.d); // undefined, never touches b/c/d

ليس للتعيين

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

const o = { x: 1 };
// o?.x = 5; // SyntaxError
o.x = 5;
console.log(o.x);

الدمج مع المصفوفات

يعمل أيضًا مع الوصول باستخدام الأقواس المربعة، وهو موضوع سنغطيه لاحقًا بمزيد من التفصيل. وينطبق الأمان نفسه على القيم nullish.

const state = { items: ["a", "b"] };
console.log(state.items?.[0]); // "a"

تجنب الإفراط في الاستخدام

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

const order = { total: 42 };
console.log(order.total?.toFixed(2)); // "42.00"

تحقق سريع

تنبأ بالنتيجة.

مراجعة

يقرأ المعامل ?. الخصائص بأمان: فإذا كان الجانب الأيسر null أو undefined فإنه يعيد undefined بدلًا من إطلاق خطأ، ويوقف تقييم بقية السلسلة مبكرًا. ولا تفعّله إلا القيم nullish، وليس 0 أو ""، كما لا يمكن استخدامه هدفًا للتعيين.

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

هل درس «التسلسل الاختياري باستخدام العامل ?.» مجاني؟

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

ماذا ستتعلم في «التسلسل الاختياري باستخدام العامل ?.»؟

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

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

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

كم من الوقت يستغرق درس «التسلسل الاختياري باستخدام العامل ?.»؟

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

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

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

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

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