to 433

Author: AhmedBaset

src/content/learn/passing-props-to-a-component.md

@@ -185,15 +185,15 @@ function Avatar(props) {
 
 <Pitfall>
 
-**لا تفوت الزوج من `{` و `}` الأقواس المجعدة** داخل `(` و `)` عند إعلان الخصائص:
+**لا تنسى زوجي `{` و `}` الأقواس المنحنية** داخل `(` و `)` عند إعلان الخصائص:
 
 ```js
 function Avatar({ person, size }) {
   // ...
 }
 ```
 
-هذه الصيغة تسمى ["تدمير"](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Unpacking_fields_from_objects_passed_as_a_function_parameter) وهي ما تعادل قراءة الخصائص من عامل الدالة:
+هذه الصيغة تسمى ["تحليل"](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Unpacking_fields_from_objects_passed_as_a_function_parameter) وهي ما تعادل قراءة الخصائص من عامل الدالة:
 
 ```js
 function Avatar(props) {
@@ -207,7 +207,7 @@ function Avatar(props) {
 
 ## تحديد قيمة افتراضية لخاصية {/*specifying-a-default-value-for-a-prop*/}
 
-إذا كنت تريد إعطاء قيمة افتراضية لخاصية تستخدم عند عدم تحديد قيمة، يمكنك القيام بذلك باستخدام الصيغة التدميرية عن طريق وضع علامة `=` والقيمة الافتراضية مباشرة بعد المعامل:
+إذا كنت تريد إعطاء قيمة افتراضية لخاصية تستخدم عند عدم تحديد قيمة، يمكنك القيام بذلك باستخدام الصيغة التحليلية عن طريق وضع علامة `=` والقيمة الافتراضية مباشرة بعد المعامل:
 
 ```js
 function Avatar({ person, size = 100 }) {
@@ -219,7 +219,7 @@ function Avatar({ person, size = 100 }) {
 
 تُستخدم القيمة الافتراضية فقط إذا كانت خاصية ال`size` مفقودة أو إذا قمت بتمرير `size={undefined}`. ولكن إذا قمت بتمرير `size={null}` أو `size={0}`, **فلن** يتم استخدام القيمة الافتراضية.
 
-## إعادة توجيه الخصائص باستخدام صيغة انتشار JSX {/*forwarding-props-with-the-jsx-spread-syntax*/}
+## إعادة توجيه الخصائص باستخدام صيغة الانتشار (spread operator) في JSX {/*forwarding-props-with-the-jsx-spread-syntax*/}
 
 في بعض الأحيان، يصبح تمرير الخصائص مُكررًا جدًا:
 
@@ -238,7 +238,7 @@ function Profile({ person, size, isSepia, thickBorder }) {
 }
 ```
 
-لا يوجد أي شيء خاطئ في تكرار الكود -  بل يمكن أن يزيد من الوضوح. ولكن في بعض الأحيان قد يقدر الاختصار. تقوم بعض المكوّنات بتوجيه جميع خصائصها إلى أطفالها, مثل الطريقة التي يفعل بها `Profile` مع `Avatar`.  نظرًا لعدم استخدامها لأي من خصائصها مباشرة ، فقد يكون من المنطقي استخدام صيغة "spread" الأكثر اختصارًا:
+لا يوجد أي شيء خاطئ في تكرار الكود - بل يمكن أن يزيد الوضوح. ولكن في بعض الأحيان قد يُفَضّل الاختصار. تقوم بعض المكوّنات بتوجيه جميع خصائصها إلى أطفالها, مثل الطريقة التي يفعل بها `Profile` مع `Avatar`.  نظرًا لعدم استخدامها لأي من خصائصها مباشرة، فقد يكون من المنطقي استخدام صيغة الانتشار "spread" الأكثر اختصارًا:
 
 ```js
 function Profile(props) {
@@ -356,7 +356,7 @@ export function getImageUrl(person, size = 's') {
 
 ## كيفية تغيير الخصائص مع مرور الوقت {/*how-props-change-over-time*/}
 
-يتلقى المكوّن `Clock` القادم خاصيتين من مكوّنه الأب: `color` و `time`. (تم حذف كود المكوّن الأب لأنه يستخدم الحالة [state](/learn/state-a-components-memory), التي لن نناقشها بعد.)
+يتلقى المكوّن `Clock` القادم خاصيتين من مكوّنه الأب: `color` و `time`. (تم حذف كود المكوّن الأب لأنه يستخدم الحالة [state](/learn/state-a-components-memory), التي لا نريد أن نتعمق فيها الآن.)
 
 جرب تغيير اللون في مربع الاختيار أدناه:
 
@@ -408,29 +408,29 @@ export default function App() {
 
 </Sandpack>
 
-يوضح هذا المثال أن **يمكن للمكوّن أن يتلقى خصائص مختلفة مع مرور الوقت.** الخصائص ليست دائمًا ثابتة! هنا ، تتغير الخاصية `time` كل ثانية, وتتغير الخاصية `color` عندما تختار لونًا آخر. تعكس الخصائص بيانات المكوّن في أي نقطة من الزمن ، عوضاً عن البدايه فقط.
+يوضح هذا المثال أنه **يمكن للمكوّن أن يتلقى خصائص مختلفة مع مرور الوقت.** الخصائص ليست دائمًا ثابتة! هنا، تتغير الخاصية `time` كل ثانية, وتتغير الخاصية `color` عندما تختار لونًا آخر. تعكس الخصائص بيانات المكوّن في أي نقطة من الزمن، عوضاً عن البدايه فقط.
 
-ومع ذلك ، تكون الخصائص [immutable](https://en.wikipedia.org/wiki/Immutable_object)—وهو مصطلح من علم الحوسبة يعني "لا يمكن تغييره". عندما يحتاج المكوّن إلى تغيير خصائصه (على سبيل المثال ، ردًا على تفاعل من المستخدم أو بيانات جديدة), سيضطر إلى "طلب" من مكوّنه الأصلي تمريره _خصائص مختلفة_—كائن جديد! سيتم رفض الخصائص القديمة ثم سيستعيد محرك JavaScript في نهاية المطاف الذاكرة التي استهلكتها.
+ومع ذلك ، تكون الخصائص [immutable](https://en.wikipedia.org/wiki/Immutable_object)—وهو مصطلح من علم الحوسبة يعني "لا يمكن تغييره". عندما يحتاج المكوّن إلى تغيير خصائصه (على سبيل المثال، ردًا على تفاعل من المستخدم أو بيانات جديدة), سيضطر إلى "طلب" من مكوّنه الأب تمريره _خصائص مختلفة_—كائن جديد! سيتم رفض الخصائص القديمة ثم سيستعيد محرك JavaScript في نهاية المطاف الذاكرة التي استهلكتها.
 
-**لا تحاول "تغيير الخصائص". ** عندما تحتاج إلى الاستجابة لإدخال المستخدم (مثل تغيير اللون المحدد) ، ستحتاج إلى "تعيين الحالة" ، والتي يمكنك التعرف عليها في [الحالة: ذاكرة المكوّن.](/learn/state-a-components-memory)
+**لا تحاول "تغيير الخصائص". ** عندما تحتاج إلى الاستجابة لإدخال المستخدم (مثل تغيير اللون المحدد)، ستحتاج إلى "تعيين الحالة" ، والتي يمكنك التعرف عليها في [الحالة: ذاكرة المكوّن.](/learn/state-a-components-memory)
 
 <Recap>
 
-* لتمرير الخصائص ، أضفها إلى JSX ، تمامًا كما تفعل مع سمات HTML.
-* لقراءة الخصائص، استخدم `function Avatar({ person, size })` صيغة تفكيك.
-* يمكنك تحديد قيمة افتراضية مثل `size = 100`, التي تُستخدم في الخصائص الناقصة والغير معرفة 'undefined'.
+* لتمرير الخصائص، أضفها إلى JSX، تمامًا كما تفعل مع سمات HTML.
+* لقراءة الخصائص، استخدم `function Avatar({ person, size })` صيغة تحليل.
+* يمكنك تحديد قيمة افتراضية مثل `size = 100`, التي تُستخدم في الخصائص الناقصة وغير المُعرّفة 'undefined'.
 * يمكنك توجيه جميع الخصائص باستخدام صيغة الانتشار `<Avatar {...props} />` ، ولكن لا تستخدمها بكثرة!
 * JSX المتداخل مثل `<Card><Avatar /></Card>` سيظهر كخاصية `children` للمكوّن `Card`.
 * تمثل الخصائص لقطات للقراءة فقط في الوقت: يتلقى كل عرض نسخة جديدة من الخصائص.
-* ا يمكنك تغيير الخصائص. عندما تحتاج إلى التفاعلية ، ستحتاج إلى تعيين الحالة.
+* لا بمكنك تغيير الخصائص. عندما تحتاج إلى التفاعلية، ستحتاج إلى تعيين الحالة.
 
 </Recap>
 
 
 
 <Challenges>
 
-#### إستخراج مكوّن {/*extract-a-component*/}
+#### استخراج مكوّن {/*extract-a-component*/}
 
 يحتوي مكوّن `Gallery` هذا على بعض الmarkup المماثلة جدًا لاثنين من الملفات. استخرِج  مكوّن ال`Profile` منه لتقليل التكرار. سوف تحتاج إلى اختيار الخصائص التي ستمررها إليه.