الدرس 6 من 8

الحالة المشتقّة

هدف الدرس

احسب ولا تخزّن

01

الشرح

بعض القيم ليست حالة بل نتيجة تُحسب منها، فعدد القطع ومجموع السلّة يُحسبان من العناصر، وإن خزّنتهما في state بجوار العناصر صارت المعلومة نفسها محفوظة في مكانين، ولزمك أن تحدّث الاثنين في كل مكان يتغيّر فيه أحدهما.

ولن تتذكّر ذلك دائمًا، ففي الكود أدناه تحدّث الإضافةُ المجموعَ وينساه الحذف، فتعرض السلّة رقمًا خاطئًا، وهذا من أكثر أعطال الواجهات شيوعًا وأصعبها تتبّعًا.

والقاعدة هنا: خزّن أقلّ ما يمكن، واحسب الباقي عند الرسم، فتشغيل reduce على عشرات العناصر أرخص بكثير من خطأ واحد سببه قيمتان لم تُحدَّثا معًا.

02

المطلوب

احذف count وtotal من state ومن المستمعين، واحسبهما داخل render() من state.items، فالعدد هو مجموع الكمّيات qty، والمجموع هو مجموع price × qty.

الفحوص

5 فحوص
  1. الحالة لا تخزّن ما يُحسب منها
  2. العدد هو مجموع الكمّيات والمجموع صحيح
  3. الإضافة تُبقي الرقمين صحيحين
  4. الحذف يُبقي الرقمين صحيحين
  5. أي تغيير في العناصر يظهر في الرسم التالي
03

تلميحات

0/3
index.html
المعاينة
index.html100%
–/5

اضغط «تشغيل وتصحيح» ليبدأ الفحص.

تجد 5 فحوص في بطاقة «المطلوب».