القيم الافتراضية للخصائص
عيّن قيمًا احتياطية للخصائص عندما لا يزوّدها المكوّن الأصل
القيم الافتراضية للخصائص درس مجاني في Sveltejs Academy على CoddyKit. هذا هو الدرس 3 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في Sveltejs Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة Sveltejs Academy 4 دروس في المجموع.
لماذا القيم الافتراضية
تجعل القيم الافتراضية المكوّن قابلًا للاستخدام من دون أن يمرر كل مستخدم كل prop. وهي تحدد السلوك الاحتياطي.
قيمة افتراضية مضمنة
عيّنوا قيمة عند إعلان prop.
export let label = "Click me";القيم الافتراضية للدوال
يمكن أن تكون القيم الافتراضية تعبيرات أو دوالًا حرفية.
export let onClick = () => {};القيم الافتراضية للكائنات
استخدموا كائنًا حرفيًا للقيم الافتراضية المعقدة.
export let options = { color: "blue", size: "md" };انتبهوا إلى المرجع المشترك
تُقيَّم القيم الافتراضية للكائنات الحرفية لكل مثيل، لذلك يحصل كل مكوّن على كائنه الخاص. ويمكن تعديلها بأمان.
تجاوز القيمة من المكوّن الأب
عندما يوفر المكوّن الأب قيمة، فإنها تستبدل القيمة الافتراضية لذلك المثيل.
<Button label="Save" />اكتشاف القيم المطلوبة
من دون قيمة افتراضية، يُعد prop مطلوبًا من الناحية المفاهيمية. ويمكن لـ TypeScript فرض ذلك باستخدام التلميح required.
null و undefined
يؤدي تمرير undefined كقيمة إلى تطبيق القيمة الافتراضية، أما تمرير null فلا يفعل ذلك.
تركيب القيم الافتراضية
ركّبوا القيم الافتراضية من props أخرى باستخدام التصريحات التفاعلية.
export let title = "";
export let subtitle;
$: effectiveSubtitle = subtitle ?? title;التوثيق
وثّقوا القيم الافتراضية في تعليقات JSDoc لمساعدة تلميحات IDE على عرضها.
/** @param {string} label */قيم افتراضية مستقرة
تجنبوا القيم الافتراضية التي تتغير بين عمليات التصيير. تقلل القيم الافتراضية المستقرة من عمليات إعادة التصيير والسلوك المفاجئ.
تحقق سريع
كيف تعيّنون قيمة افتراضية لـ prop؟
مراجعة
وفّروا القيم الافتراضية باستخدام إسناد عادي. فهي تجعل المكوّنات مكتفية ذاتيًا وتوضح أي props اختيارية.
الأسئلة الشائعة
هل درس «القيم الافتراضية للخصائص» مجاني؟
نعم — نص درس «القيم الافتراضية للخصائص» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة Sveltejs Academy، انتقل إلى CoddyKit PRO. تتضمن دورة Sveltejs Academy 4 دروس في المجموع.
ماذا ستتعلم في «القيم الافتراضية للخصائص»؟
عيّن قيمًا احتياطية للخصائص عندما لا يزوّدها المكوّن الأصل تتمرن على Sveltejs Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.
هل أحتاج إلى خبرة سابقة لأبدأ Sveltejs Academy؟
لا تُشترط خبرة سابقة. Sveltejs Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 3 من أصل 4.
كم من الوقت يستغرق درس «القيم الافتراضية للخصائص»؟
معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.
هل يمكنني كتابة وتشغيل أكواد في درس Sveltejs Academy هذا؟
نعم. كل درس في Sveltejs Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.
جميع الدروس في هذه الدورة
- التصريح بالخصائص باستخدام export let
- تمرير الخصائص من المكوّن الأصل
- القيم الافتراضية للخصائص
- تمرير الخصائص باستخدام $$props و$$restProps