شرح type conversion و type coercion و معرفة الفرق بينهما

Javascript كايحتاوي على العديد من الخاصيات اللي بإمكانهم يساعدوك تكتب code قليل و واضح. من بين هاد الخصائص, كاين type conversion و type coercion (ما تخلعكومش السمية) . الفهم ديالهم سهل لكن مهم باش تتجنب المشاكل و الأخطاء في ل code ديالك, النوع ديال الأخطاء اللي مكاتعرفوش منين جاي , لأنه جاي من عدم فهمك للأساسيات.

type conversion و type coercion كايديرو نفس الخدمة اللي هي تحويل نوع القيم, مثلا من String إلى Number أو من Number إلى Boolean . لكن الطريقة و فوقاش غاتستخدم كل وحدة فيهم هي اللي كاتختالف.

1. Type conversion :

نقدرو نقولو انها تحويل نوع قيمة ما يدويا أو عن قصد. أي انك انت اللي بغيتي دير داك التحويل.

مثال

نفتارضو انك بغيتي تاخد عمر المستخدم, غادي تستخدم input اللي من خلالها إقدر المستخدم يدخل العمر ديالو. لكن ل input ملي غاتقرا القيمة اللي فيها , غاتكون من نوع String لذلك إلى بغيتي دير شي عملية حسابية بإستخدام عمر المستخدم خاصك تحولو من String إلى Number :

const ageInput = document.querySelector(".age");
const age = Number(ageInput.value);

دائما غا تحتاج دير بحال هاد التحويلات باش تقدر تخدم بالقيم كيف بغيتي. ل Methods اللي غايعاونوك فهادشي, كاين :

• ()String : لتحويل القيم إلى نوع String.

• ()Number : لتحويل القيم إلى نوع Number لكن غلى كانت ديك القيمة اللي بقيتي تحول ماشي رقم صالح , النتيجة غاتكون NaN اللي كاتعني Not A Number (نوع NaN هو Number).

• ()Boolean : لتحويل أي قيمة إلى نوع Boolean أي True أو False.

2. Type coercion :

هاد النوع ديال التحويل كايدار تلقائيا من طرف javascript, هادشي علاش يقدر يسبب ليك مشاكل و أخطاء في ل code ديالك إلى ما فهمتيهش مزيان.

مثال

نرجعو للمثال الأول و نفتارضو أنك بغيتي تأكد أن المستخدم ما خلاش ل input خاويا. إلى ما ستعملتيش Type coercion ل code غايكون على هاد الشكل :

const ageInput = document.querySelector(".age");

if(ageInput.value.trim() !== ""){
// ...
}

من المعروف أن أي String ما دامت غير فارغة فهي true حتى و إن كانت تحتوي فقط على الفراغ, لذلك إستعملت ()trim لنزع الفراغ من جوانب String.

بمعرفتنا لهذه الأمور و إذا إستعملنا Type coercion ل code غايكون على هاد الشكل :

const ageInput = document.querySelector(".age");

if(ageInput.value.trim()){
// ...
}

بدون ما نديرو المقارنة بين قيمة ل input و "" (String فارغة) Javascript غايقوم تلقائيا بتحويل أي قيمة بين الاقواس ديال if إلى نوع Boolean.

هاد النمط كايتواجد بزاف في javascript, و هادو بعض الامثلة.

1 + "1"  // "11"
1 - "1" // 0
true * false // 0
10 / true // 10
1 == true // true
"15" * 1 // 15

هادشي غايبان لك غريب, لكن ملي غاتفهمو غاتلقاه مفيد و كايساعد فالعمل.