تحويل النصوص إلى الأرقام
سنشرح اليوم عن تحويل النص إلى ارقام في لغة الجافاسكربت, في العادة يكون مثلاَ لدينا متغير يملك رقم لكن عبارة عن نص String و لا يمكن جمعه مع رقم int.
var number = 20;
var number2 = "30";
number+=number2;
console.log(number);
سوف تكون النتيجة هذه في المتصفح في console هي 2030 سيدمج النص مع الرقم.
اذا نريد جمعها كأرقام و تحويل هذا النص str إلى رقم سوف نستخدم الأمر parseInt وضمن الأقواس نضع المتغير النصي الذي نريد تحويله.
var number = 20;
var number2 = "30";
number+= parseInt(number2);
console.log(number);
هنا عند عرض النتيجة سوف يعرضها 50 لأننا حولنا النص لرقم.
اذا كانت موجودة فواصل ضمن الرقم الذي في المتغير النصي لن يتم احتساب ما بعد الفاصلة, فقط يأخذ الرقم الصحيح, في حال اردنا ان يظهر لنا ما بعد الفاصلة سوف نستخدم parseFloat بدل parseInt لكي يظهر لنا ما بعد الفاصلة و حرف F يجب ان يكون حرف كابتل.
var number = 20;
var number2 = "30.5";
number+= parseFloat(number2);
console.log(number);
سيعطي النتيجة 50.5
غالبية عناصر html عندما نريد الحصول على القيمة منها تكون القيمه نوع نص String و بالتالي اذا كنا نريد الحصول على قيمة من نوع ارقام Int لا يتم هذا إلا بأستخدام هذه الطريقة parseFloat.
مثال
سوف ننشئ عنصر Input من نوع ارقام Int كالمثال التالي
في ملف html يكون
وفي ملف الجافاسكربت يكون
var number1 = document.getElementById("input").value;
var number2 = 30;
var result = number1 + number2;
console.log(result);
var result = number1 + number2;
console.log(result);
شرح المثال
في المثال السابق بملف html وضعنا عنصر الادخال input ووضعنا ان العنصر من نوع بيانات ارقام و اعطيناه id بإسم input ووضعنا الخاصية onkeydown الذي شرحناها في الدرس السابق كانت مهمتها عند ادخال في الكيبورد تعمل, ووضعنا له الفنكشن الذي انشأناها بملف الجافاسكربت.عند الفتح في المتصفح سوف يظهر لنا زر input الذي انشأناه و نشغل الـ console و نكتب اعداد في مكان الـ input و نلاحظ التغير في console.
مثلاً لو كتبنا في المستطيل الرقم 45 سوف نلاحظ في الكونسل يظهر الرقم 430 نغير القيم حسبما نريد.
كما لاحظنا عند كتابة اي قيمة في الفراغ تظهر قيمة في console.
لكن عندما نغير محتوى المتغير الاول number1 للارقام بالطريقة التالية سوف يعمل بشكل طبيعي.
function getValue(){
var number1 = document.getElementById("input").value;
var number2 = 30;
var result = parseInt(number1) + number2;
console.log(result);
}var result = parseInt(number1) + number2;
console.log(result);
عند ادخال اي قيمة سوف يجمعها بشكل طبيعي فوق القيمة 30 .
و توجد طريقة اخرى و هي وضع Number بدل parseInt كالتالي
function getValue(){
var number1 = document.getElementById("input").value;
var number2 = 30;
var result = Number(number1) + number2;
console.log(result);
}var result = Number(number1) + number2;
console.log(result);
قناتنا التلغرام
https://t.me/Programmer_Tech
المدونة
https://www.programmer-tech.com
صفحة الفيسبوك
https://www.facebook.com/ProgrammerTech.net
قناة اليوتيوب 1:
https://www.youtube.com/ahmadkaissar
قناة اليوتيوب 2:
https://www.youtube.com/MuhammadAlush0997
https://t.me/Programmer_Tech
المدونة
https://www.programmer-tech.com
صفحة الفيسبوك
https://www.facebook.com/ProgrammerTech.net
قناة اليوتيوب 1:
https://www.youtube.com/ahmadkaissar
قناة اليوتيوب 2:
https://www.youtube.com/MuhammadAlush0997
ليست هناك تعليقات:
إرسال تعليق