0Pricing
Sveltejs Academy · درس

القيم المحسوبة: تصريحات $ التفاعلية

اشتقّ القيم تلقائيًا من الحالة التفاعلية باستخدام صيغة التسمية $:

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

التسمية $:

أضف $: إلى بداية أي عبارة لجعلها تفاعلية. وستُعاد عند تغيّر المتغيّرات المشار إليها.

$: doubled = count * 2;

التتبع التلقائي

يفحص Svelte الجانب الأيمن بحثًا عن مراجع المتغيّرات. ولا تحتاج إلى سرد التبعيات يدويًا.

الاستخدام في البنية

استخدم القيمة المشتقة في القوالب كما تستخدم أي متغيّر تفاعلي آخر.

<p>Double: {doubled}</p>

صيغة الكتلة

يمكن للتسمية التفاعلية أن تغلّف كتلة من العبارات لتنفيذ الآثار الجانبية.

$: {
  console.log("count changed to", count);
  localStorage.setItem("count", count);
}

عبارات تفاعلية متعددة

صرّح عن العدد الذي تحتاجه من عبارات $:. ويرتّبها Svelte وفق تبعياتها.

$: doubled = count * 2;
$: quadrupled = doubled * 2;

if تفاعلية

يمكنك دمج $: مع تدفق التحكم لتنفيذ آثار جانبية شرطية.

$: if (count >= 10) { alert("limit reached"); }

ما يعادل useEffect

فكّر في $: على أنه صيغة أسهل استخدامًا من useEffect. ولا توجد مصفوفات تبعيات.

تجنّب العمل المكلف

ينبغي أن تكون العبارات التفاعلية سريعة. وبالنسبة إلى العمليات الحسابية المكلفة، فكّر في التخزين المؤقت أو نقل العمل إلى store.

التنفيذ غير المتزامن داخلها

يمكنكم استخدام await داخلها، لكن احذروا: قد يُعاد تشغيل العبارة قبل اكتمال عمليات await السابقة.

متى لا تستخدمها

بالنسبة إلى الدوال النقية التي تعتمد على المدخلات، يُعد $: x = f(y) خيارًا ممتازًا. أما بالنسبة إلى الآثار الجانبية الفعلية، ففضّلوا خطافات دورة الحياة مثل onMount.

على المستوى الأعلى فقط

يجب أن تكون تسمية $: على المستوى الأعلى من كتلة script، وليس داخل دالة أو كتلة متداخلة.

تحقق سريع

ماذا يفعل $:؟

مراجعة

تُعلن $: القيم المحسوبة التفاعلية والآثار الجانبية. ويُتتبَّع الاعتماد تلقائيًا.

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

هل درس «القيم المحسوبة: تصريحات $ التفاعلية» مجاني؟

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

ماذا ستتعلم في «القيم المحسوبة: تصريحات $ التفاعلية»؟

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

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

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

كم من الوقت يستغرق درس «القيم المحسوبة: تصريحات $ التفاعلية»؟

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

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

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

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

  1. بنية script وtemplate وstyle
  2. المتغيرات التفاعلية باستخدام let
  3. الاستيفاء: {expression}
  4. القيم المحسوبة: تصريحات $ التفاعلية
← العودة إلى Sveltejs Academy