مقدمة الى الارقام - JavaScript Numbers
-
بنحكي في هذا الدرس عن الأرقام JavaScript Numbers. وبنحكي في هذا الدرس عن Regular numbers. يتم تخزين هذه الأرقام من هذا النوع في 64-bit بتنسيق IEEE-754 وتعرف باسم double precision floating point" numbers"، ولا تحتوي لغة JavaScript على الأنواع الأخرى من الأرقام مثل integers, short, long, floating-point ... الخ.
اذا مثل ما حكينا في لغة JavaScript عندنا نوع واحد من الأرقام يعرف ب double precision floating point numbers
هه الأرقام من هذه النوع يتم تخزينها في 64-bit وبتنسيق IEEE-754 ، واذا كانت الأرقام تحتوي على كسور يتم تخزينها في bits من 0 الى 51. واذا كانت تحتوي على الأس exponent يتم تخزينها في bits من 52 الى 62 . و sign in في bit يساوي 63
مثال :
نطبق مثال بسيط ونشوف كيف ممكن نعرف الأرقام في JavaScript
<!DOCTYPE html>
<html>
<body onunload="">
<h3>JavaScript Numbers</h3>
<p id="Date"></p>
<script>
let x = 10.14; // A number with decimals
let y = 10; // A number without decimals
document.write("A number with decimals :" + x );
document.write("<br>");
document.write("A number without decimals :" + y );
</script>
</body>
</html>
النتيجة:
المثال بسيط جدا عرفنا 2 متغير: الأول يحتوي عدد صحيح بدون كسور، والثاني يحتوي كسور وطبعنا النتيجة على الشاشة.
لاحظ طريقة التعريف باستخدام الامر Let يعني ما حددنا نوع الرقم. (اللغة بتعمل على التحديد بشكل تلقائي)
للمزيد حول طريقة التعريف انقر هنا
اختصار العدد shorten a number
يمكن في JavaScript اختصار الاعداد باستخدام الحرف e وتحديد عدد الاصفار مع الحرف e. الهدف اختصار الكتابة بدل من كتابة ارقام طويلة تحتوي عل اصفار
مثال :
لكتابة الرقم 1 مليار مثلا بالطريقة العادية بكون شكل الكود:
<!DOCTYPE html>
<html>
<body onunload="">
<h3>JavaScript Numbers</h3>
<p id="Date"></p>
<script>
let x = 1000000000; // 1 billion
document.write("A number with decimals :" + x );
document.write("<br>");
</script>
</body>
</html>
النتيجة:
طريقة الكتابة والطباعة هي الطريقة المعتادة.
اختصار هذا الحكي في JavaScript بكون بالشكل التالي :
<!DOCTYPE html>
<html>
<body onunload="">
<h3>JavaScript Numbers</h3>
<p id="Date"></p>
<script>
let x = 1e9; // 1 billion
document.write("A number with decimals :" + x );
document.write("<br>");
</script>
</body>
</html>
النتيجة :
الفرق بدل كتابة مليار مع 9 اصفار، اضفنا الحرف e وعدد الاصفار المطلوب عرضها.
اختصار العدد بشكل عكسي shorten a number
المقصود هنا كتابة الاصفار قبل الرقم اذا كان عندنا عدد كبير من الاصفار.
يتم الكتابة بنفس الطريقة السابقة لكن مع أضافة إشارة الناقص – قبل الحرف e
مثال: إضافة 6 اصفار قبل الرقم 1
الطريقة العادية :
<!DOCTYPE html>
<html>
<body onunload="">
<h3>JavaScript Numbers</h3>
<p id="Date"></p>
<script>
let x = 0.0000001;
document.write( x );
document.write("<br>");
</script>
</body>
</html>
الطريقة المختصرة :
<!DOCTYPE html>
<html>
<body onunload="">
<h3>JavaScript Numbers</h3>
<p id="Date"></p>
<script>
let x = 0.1e-6;
document.write( x );
document.write("<br>");
</script>
</body>
</html>
النتيجة:
دقة الاعداد الصحيحه Integer Precision
الأعداد الصحيحة (الأرقام بدون نقطة period أو رمز الأس exponent notation) دقيقة حتى 15 رقمًا. بمعني اخر بعد الرقم 15 يتم اجراء التقريب.
مثال:
<!DOCTYPE html>
<html>
<body onunload="">
<h3>JavaScript Numbers</h3>
<p id="Date"></p>
<script>
let x = 999999999999999;
let y = 9999999999999999;
document.write( x +"<br>"+y);
document.write("<br>");
</script>
</body>
</html>
النتيجة:
لاحظ اول رقم لان يحتوي على 15رقم ما تم التقريب له، بينما الرقم الثاني ولان يحتوي على 16 رقم تم التقريب.
دقة الاعداد Floating Precision
عند التعامل مع الأرقام من نوع float يجب الانتباه جيدا لان النتائج قد لا تكون دقيقة دائما باستخدام العمليات الاعتيادية.
نشوف المثال التالي :
<!DOCTYPE html>
<html>
<body onunload="">
<h3>JavaScript Numbers</h3>
<p id="Date"></p>
<script>
let x = 0.2 + 0.1;
document.write( x );
document.write("<br>");
</script>
</body>
</html>
النتيجة
لاحظ ان النتيجة غير دقيقة بهذه الطريقة.
الحل الموصى به هو استخدام عوامل التصحيح correction factors، والذي يعني ضرب الأرقام بعدد مناسب (suitable power)بحيث يتم تحويلها الى عدد صحيح ومن ثم يتم اجراء العملية المطلوبة على العدد الصحيح)
في هذه المثال يكون suitable power يساوي 10
بناء علية بكون شكل الكود بعد التعديل:
<!DOCTYPE html>
<html>
<body onunload="">
<h3>JavaScript Numbers</h3>
<p id="Date"></p>
<script>
let x = 0.2 ;
let y = 0.1;
let SP=10
document.write( (x *SP + y * SP) / SP );
document.write("<br>");
</script>
</body>
</html>
النتيجة:
الاعداد والسلاسل Numbers and Strings
عند محاول إضافة عدد الى نص string، اكيد JavaScript لن يقوم بعمل عملية حسابية، بدل من ذلك يتم دمج الأرقام مع النصوص والنتيجة بتكون نص.
يتم استخدام + operator في عمليات الإضافة في الأرقام والنصوص، لكن الفرق في الأرقام يتم اجراء عمليات حسابية للإضافة، بينما في النصوص يتم اجراء عمليات الدمج concatenated.
اجراء عملية الإضافة على الأرقام سهله
مثال:
<!DOCTYPE html>
<html>
<body onunload="">
<h3>JavaScript Numbers</h3>
<p id="Date"></p>
<script>
let x = 1000 ;
let y = 800;
document.write( x + y);
document.write("<br>");
</script>
</body>
</html>
النتيجة :
اجراء عملية الإضافة في النصوص
مثال :
<!DOCTYPE html>
<html>
<body onunload="">
<h3>JavaScript Numbers</h3>
<p id="Date"></p>
<script>
let x = "1000" ;
let y = "800";
document.write( x + y);
document.write("<br>");
</script>
</body>
</html>
النتيجة:
لاحظ ان حولنا الأرقام الى string وبعدها جمعناهم وكانت النتيجة دمج الرقمين مع بعض على شكل string
مثال لجمع ارقام مع string
<!DOCTYPE html>
<html>
<body onunload="">
<h3>JavaScript Numbers</h3>
<p id="Date"></p>
<script>
let x = 1000 ;
let y = "800";
document.write( x + y);
document.write("<br>");
</script>
</body>
</html>
النتيجة
الرقم 1000 تم جمعه مع “800” والنتيجة string
ملاحظة :
المترجم في JavaScript interpreter يعمل من اليسار الى اليمين (الأولوية بتكون من اليسار)
حتى نفهم هذه الحكي نشوف الأمثلة التالية
مثال :
<!DOCTYPE html>
<html>
<body onunload="">
<h3>JavaScript Numbers</h3>
<p id="Date"></p>
<script>
let x = 1000 ;
let y = 800;
document.write("Result:"+ x + y);
document.write("<br>");
</script>
</body>
</html>
النتيجة :
لاحظ ان بالرغم من ان الرقمين x و y ارقام الا ان النتيجة دمج الأرقام على شكل string، والسبب ان اضفنا في الطباعة string قبل عملية جمع الرقمين باسم Result وجمعنها مع الرقمين. يعني اول متغير من اليسار هو string لذا بتكون النتيجة string
مثال :
<!DOCTYPE html>
<html>
<body onunload="">
<h3>JavaScript Numbers</h3>
<p id="Date"></p>
<script>
let x = 1000 ;
let y = 800;
let z="100"
document.write(x + y + z);
document.write("<br>");
</script>
</body>
</html>
النتيجة :
تم جمع الأرقام x و y في البداية ومن ثم تم دمجهم مع string في z . السبب ان مثل ما حكينا المترجم بشتغل من اليسار الى اليمين وفي هذا المثال اول متغيرين من اليسار هم ارقام بناء عليه تم اجراء علمية الجمع وبعدها الدمج.
سلاسل رقمية Numeric Strings
اذا كانت المتغيرات تحتوي ارقام وبتكون بين اقواس تسمى Numeric Strings
مثال
Let x="1000"
في لغة JavaScript يتم محاولة تحويل string الى ارقام في العمليات الحسابية الضرب، القسمة، الطرح (ما عدا عملية + ).
مثال :
<!DOCTYPE html>
<html>
<body onunload="">
<h3>JavaScript Numbers</h3>
<p id="Date"></p>
<script>
let x = "1000" ;
let y = "800";
let z= x-y;
document.write("x-y=" + z);
document.write("<br>");
z= x*y;
document.write("x*y="+z );
document.write("<br>");
z= x/y;
document.write("x/y="+ z );
document.write("<br>");
z= x+y;
document.write("x+y="+ z );
</script>
</body>
</html>
النتيجة:
لاحظ ان في جميع العمليات تم تحويل string الى number واجراء العملية المطلوبة باستثناء عملية الجمع. والسبب ان + Operator يستخدم للدمج concatenate the strings
أرقام JavaScript ك Object - JavaScript Numbers as Objects
يمكن تعريف الأرقام في JavaScript ك object باستخدام الكلمة keyword المحجوزة في اللغة New.
ولا ينصح باستخدام هذه الطريقة لان الكلمة New قد تؤدي الى نتاج غير متوقعه، كما انها قد تسبب بطئ في الكود وتعقيدات لا حاجة لها.
طريقة الكتابة :
<!DOCTYPE html>
<html>
<body onunload="">
<h3>JavaScript Numbers</h3>
<p id="Date"></p>
<script>
let x = "1000" ;
let y = new Number("800");
let z= x-y;
document.write("x-y=" + z);
document.write("<br>");
z= x*y;
document.write("x*y="+z );
document.write("<br>");
z= x/y;
document.write("x/y="+ z );
document.write("<br>");
z= x+y;
document.write("x+y="+ z );
</script>
</body>
</html>
النتيجة:
يمكن طباعة نوع المتغير باستخدام الامر typeof
مثال :
<!DOCTYPE html>
<html>
<body onunload="">
<h3>JavaScript Numbers</h3>
<p id="Date"></p>
<script>
let x = "1000" ;
let y = new Number("800");
let z= x-y;
document.write(typeof x);
document.write("<br>");
document.write(typeof y );
</script>
</body>
</html>
النتيجة:
الفرق بين = و == و ===
تستخدم العلامة = لتعيين قيمة الى متغير .
تستخدم العلامة == لإجراء عملية المقارنة بين الأنواع نفسها، تعمل على تحويل المتغيرات operands التي لها نفس النوع قبل اجراء المقارنة (تعني يساوي equal).
مثال ذلك عند مقارنة string و number، تقوم JavaScript بتحويل أي string إلى number. يتم تحويل السلسلة الفارغة empty string دائمًا إلى صفر. يتم تحويل السلسلة string التي ليس لها قيمة رقمية numeric value إلى NaN (ليس رقمًا) ، والتي ترجع القيمة false.
تستخدم العلامة === لإجراء عملية المقارنة أيضا لكن بشكل صارم بمعنى لا يتم تحويل المتغيرات operand هنا، يتم اجراء المقارانات بين operand كما هي وتعني لا يساوي not equal
امثلة:
<!DOCTYPE html>
<html>
<body onunload="">
<h3>JavaScript Numbers</h3>
<p id="Date"></p>
<script>
let x = 1000 ;
let y = 1000;
let z="1000";
document.write(x=y);
document.write("<br>");
document.write(x==z);
document.write("<br>");
document.write(y===z);
</script>
</body>
</html>
النتيجة:
مثال :
<!DOCTYPE html>
<html>
<body onunload="">
<h3>JavaScript Numbers</h3>
<p id="Date"></p>
<script>
let x = 1000 ;
let y = 1000;
let z= new Number (1000);
document.write(x=y);
document.write("<br>");
document.write(x==z);
document.write("<br>");
document.write(y===z);
</script>
</body>
</html>
النتيجة
المقارنة بين Object في JavaScript دائما النتيجة False
NaN - Not a Number
NaN هي كلمة محجوزة reserved word في JavaScript تشير إلى أن الرقم ليس رقمًا صحيحا legal number.
مثال ذلك: عند محاولة إجراء العمليات الحسابية باستخدام سلسلة غير رقمية non-numeric string إلى NaN
مثال:
<!DOCTYPE html>
<html>
<body onunload="">
<h3>JavaScript Numbers</h3>
<p id="Date"></p>
<script>
let x = 1000 ;
let y = "Hello";
document.write(x-y);
document.write("<br>");
</script>
</body>
</html>
النتيجة:
يمكن استخدام JavaScript function المسمى ()isNaN للتأكد من ان النتيجة ليست رقم وتحتوي على Nan
مثال:
<!DOCTYPE html>
<html>
<body onunload="">
<h3>JavaScript Numbers</h3>
<p id="Date"></p>
<script>
let x = 1000 ;
let y = "Hello";
document.write(isNaN(x-y));
document.write("<br>");
</script>
</body>
</html>
النتيجة:
ملاحظة: NaN هي عبارة عن رقم (number)، يعني بمحاولة ارجاع نوعها باستخدام الكود typeof NaN بتكون النتيجة Number
مثال :
<!DOCTYPE html>
<html>
<body onunload="">
<h3>JavaScript Numbers</h3>
<p id="Date"></p>
<script>
let x = 1000 ;
let y = "Hello";
let z= NaN;
document.write(typeof z);
document.write("<br>");
</script>
</body>
</html>
النتيجة:
Infinity
يتم ارجاع هذه القيمة عند اجراء عملية حسابية بتكون النتيجة كبيرة جدا خارج الأرقام الممكنة. او عند القسمة على صفر
مثال :
<!DOCTYPE html>
<html>
<body onunload="">
<h3>JavaScript Numbers</h3>
<p id="Date"></p>
<script>
let x = 1.38044415527744497e+154 ;
let y = 1.34078085925512597e+154;
let z= NaN;
document.write(x*y);
document.write("<br>");
</script>
</body>
</html>
النتيجة:
ملاحظة: Infinityهي عبارة عن رقم (number)، يعني بمحاولة ارجاع نوعها باستخدام الكود typeof Infinity بتكون النتيجة Number
اترك تعليقك