JavaScript: الأرقام والرياضيات في جافاسكريبت

في جافاسكريبت، يوجد نوع رقم واحد فقط: Number. سواء كان عددًا صحيحًا أو عشريًا، هو بالكامل Number. هذا مختلف عن لغات مثل Java أو C التي تميز بين int وfloat وما إلى ذلك. أبسط، نعم — لكن يأتي مع بضعة مفاجآت.

1. نوع Number

في جافاسكريبت، كلا الأعداد الصحيحة والأعداد العشرية الم floating point هما من نوع Number — لا يوجد نوع عدد صحيح منفصل.

HTML
<script>
let a = 42;        // هذا Number
let b = 3.14;      // هذا أيضًا Number
typeof a;          // "number"
typeof b;          // "number"
</script>

يمكن كتابة الأرقام أيضًا بعدة صيغ أخرى:

HTML
<script>
let hex = 0xFF;       // سداسي عشري، يساوي 255
let octal = 0o10;     // ثماني، يساوي 8
let binary = 0b1010;  // ثنائي، يساوي 10
let big = 1e6;        // ترميز علمي، يساوي 1000000
</script>

▶ مثال

JAVASCRIPT
// مثال على الكود في هذا القسم
const message = "مرحبا بالعالم!";
console.log(message);
▶ جرّب الكود

هذا أبسط مثال; الأقسام التالية ستشرح بالتفصيل.## 2. NaN وInfinity

NaN يعني "ليس رقمًا"، لكنه من نوع Number — واحدة من أكثر خيارات التصميم الساخرة في جافاسكريبت.

HTML
<script>
typeof NaN;          // "number"  ← نعم، إنه فعلًا رقم
NaN === NaN;         // false     ← ليس حتى مساويًا لنفسه!
Number.isNaN(NaN);   // true      ← استخدم هذا الأسلوب للتحقق من NaN
</script>

متى يظهر NaN؟ عندما تحاول القيام بعملية رياضية بشيء ليس رقمًا:

HTML
<script>
parseInt('abc');    // NaN
'hello' * 5;       // NaN
Math.sqrt(-1);     // NaN
</script>

Infinity يمثل اللانهاية الموجبة ويظهر عند القسمة على صفر:

HTML
<script>
1 / 0;             // Infinity
-1 / 0;            // -Infinity
typeof Infinity;   // "number"
</script>
💡 تلميح: للتحقق مما إذا كانت القيمة NaN، لا تستخدم === أبدًا — استخدم Number.isNaN(). بما أن NaN === NaN هو false، هذا فخ وقع فيه عدد لا يحصى من المطورين.


2. دقة الأرقام الم floating point

هذا هو أغرب ما في جافاسكريبت: 0.1 + 0.2 !== 0.3.

HTML
<script>
0.1 + 0.2;          // 0.30000000000000004
0.1 + 0.2 === 0.3;  // false
</script>

السبب يتعلق بكيفية تخزين الأرقام الم floating point في نظام ثنائي بواسطة الحواسيب. القيمة 0.1 هي كسر متكرر في نظام ثنائي، مما يؤدي إلى فقدان الدقة أثناء التخزين. هذا ليس مقصورًا على جافاسكريبت — جميع اللغات التي تستخدم معيار IEEE 754 لديها هذه المشكلة.

الحل: استخدم toFixed() للتنسيق، أو قم بالتكبير قبل الحساب:

HTML
<script>
(0.1 + 0.2).toFixed(2);   // "0.30"
(0.1 * 100 + 0.2 * 100) / 100;  // 0.3
</script>

▶ مثال: عرض مشاكل الدقة

HTML
<!DOCTYPE html>
<html>
<body>
  <h2>مشاكل دقة الأرقام الم floating point</h2>
  <p id="output"></p>
  <script>
    let html = '';
    html += '0.1 + 0.2 = ' + (0.1 + 0.2) + '<br>';
    html += '0.1 + 0.2 === 0.3 ? ' + (0.1 + 0.2 === 0.3) + '<br><br>';
    html += '<strong>الحل 1: toFixed</strong><br>';
    html += '(0.1 + 0.2).toFixed(2) = ' + (0.1 + 0.2).toFixed(2) + '<br><br>';
    html += '<strong>الحل 2: تكبير ثم تصغير</strong><br>';
    html += '(0.1*100 + 0.2*100)/100 = ' + ((0.1 * 100 + 0.2 * 100) / 100) + '<br><br>';

    html += '<strong>NaN ذات الصلة:</strong><br>';
    html += 'parseInt("abc") = ' + parseInt('abc') + '<br>';
    html += 'NaN === NaN ? ' + (NaN === NaN) + '<br>';
    html += 'Number.isNaN(NaN) ? ' + Number.isNaN(NaN) + '<br><br>';

    html += '<strong>Infinity ذات الصلة:</strong><br>';
    html += '1 / 0 = ' + (1 / 0) + '<br>';
    html += 'typeof Infinity = ' + typeof Infinity;

    document.getElementById('output').innerHTML = html;
  </script>
</body>
</html>
▶ جرّب الكود

3. كائن Math

Math هو أداة الرياضيات المدمجة في جافاسكريبت. لا حاجة للإنشاء — فقط استدعِ أساليبه مباشرة:

الأسلوب/الخاصية الغرض مثال
Math.round() تقريب إلى أقرب عدد صحيح Math.round(4.6)5
Math.floor() تقريب للأسفل Math.floor(4.9)4
Math.ceil() تقريب للأعلى Math.ceil(4.1)5
Math.random() رقم عشوائي 0–1 Math.random()0.3721...
Math.max() القيمة القصوى Math.max(1,5,3)5
Math.min() القيمة الدنيا Math.min(1,5,3)1
Math.PI باي 3.141592653589793
Math.abs() القيمة المطلقة Math.abs(-7)7
Math.pow() أس Math.pow(2,3)8
Math.sqrt() الجذر التربيعي Math.sqrt(16)4

▶ مثال: أساليب Math الشائعة

HTML
<!DOCTYPE html>
<html>
<body>
  <h2>أساليب كائن Math</h2>
  <p id="output"></p>
  <script>
    let html = '';
    html += 'Math.round(4.6) = ' + Math.round(4.6) + '<br>';
    html += 'Math.round(4.4) = ' + Math.round(4.4) + '<br>';
    html += 'Math.floor(4.9) = ' + Math.floor(4.9) + '<br>';
    html += 'Math.ceil(4.1) = ' + Math.ceil(4.1) + '<br>';
    html += 'Math.abs(-7) = ' + Math.abs(-7) + '<br>';
    html += 'Math.pow(2, 10) = ' + Math.pow(2, 10) + '<br>';
    html += 'Math.sqrt(144) = ' + Math.sqrt(144) + '<br>';
    html += 'Math.max(1, 5, 3) = ' + Math.max(1, 5, 3) + '<br>';
    html += 'Math.min(1, 5, 3) = ' + Math.min(1, 5, 3) + '<br>';
    html += 'Math.PI = ' + Math.PI + '<br>';

    let radius = 5;
    let area = Math.PI * Math.pow(radius, 2);
    html += `مساحة الدائرة بنصف قطر ${radius} = ${area.toFixed(2)}`;

    document.getElementById('output').innerHTML = html;
  </script>
</body>
</html>
▶ جرّب الكود
💡 تلميح: Math.round(-1.5) يُرجع -1، وليس -2. سلوك التقريب عند الحدود السالبة قد لا يتطابق مع حدسك — ضع ذلك في اعتبارك.


4. toFixed() — تنسيق الأرقام العشرية

toFixed(n) يُنسّق رقمًا إلى n خانات عشرية ويعيد نصًا:

HTML
<script>
let price = 9.9;
price.toFixed(2);    // "9.90"  ← ملاحظة: يُرجع نصًا
+(9.9).toFixed(2);   // 9.9     ← استخدم + للتحويل مرة أخرى إلى رقم
</script>
⚠️ ملاحظة: toFixed يُرجع نصًا! إذا كنت بحاجة لإجراء مزيد من العمليات الحسابية، تذكر تحويله مرة أخرى إلى رقم.


5. toString() — تحويل القاعدة

أسلوب الرقم toString(radix) يحول رقمًا إلى نص بالقاعدة المحددة:

HTML
<script>
(255).toString(16);   // "ff"  سداسي عشري
(255).toString(2);    // "11111111"  ثنائي
(255).toString(8);    // "377"  ثماني
(100).toString();     // "100"  عشري (افتراضي)
</script>

▶ مثال: تحويل القاعدة

HTML
<!DOCTYPE html>
<html>
<body>
  <h2>تحويل القاعدة</h2>
  <p id="output"></p>
  <script>
    let num = 255;
    let html = `الرقم ${num} في قواعد مختلفة:<br><br>`;
    html += `عشري: ${num.toString()}<br>`;
    html += `ثنائي: ${num.toString(2)}<br>`;
    html += `ثماني: ${num.toString(8)}<br>`;
    html += `سداسي عشري: ${num.toString(16)}<br><br>`;

    let price = 19.9;
    html += `السعر المنسق: $${price.toFixed(2)}<br>`;
    html += `نوع إرجاع toFixed: ${typeof price.toFixed(2)}<br>`;

    document.getElementById('output').innerHTML = html;
  </script>
</body>
</html>
▶ جرّب الكود

6. Math.random() — إنشاء أرقام عشوائية

Math.random() يُرجع رقمًا عشريًا عشوائيًا بين 0 (شامل) و1 (غير شامل). في الممارسة، غالبًا ما تحتاج عددًا صحيحًا عشوائيًا ضمن نطاق محدد:

HTML
<script>
// إنشاء عدد صحيح عشوائي بين min و max (شامل)
function getRandomInt(min, max) {
  return Math.floor(Math.random() * (max - min + 1)) + min;
}
</script>

▶ مثال: عرض الأرقام العشوائية

HTML
<!DOCTYPE html>
<html>
<body>
  <h2>مولد أرقام عشوائية</h2>
  <button onclick="rollDice()">رمي النرد</button>
  <button onclick="pickLotto()">اختيار أرقام (1-35)</button>
  <p id="output"></p>
  <script>
    function getRandomInt(min, max) {
      return Math.floor(Math.random() * (max - min + 1)) + min;
    }

    function rollDice() {
      let dice = getRandomInt(1, 6);
      let dots = '';
      for (let i = 0; i < dice; i++) {
        dots += ' ⚀';
      }
      document.getElementById('output').innerHTML =
        `لقد رميت <strong>${dice}</strong>${dots}`;
    }

    function pickLotto() {
      let numbers = [];
      while (numbers.length < 5) {
        let n = getRandomInt(1, 35);
        if (!numbers.includes(n)) {
          numbers.push(n);
        }
      }
      numbers.sort((a, b) => a - b);
      document.getElementById('output').innerHTML =
        `أرقامك المحظوظة: <strong>${numbers.join(' ')}</strong>`;
    }
  </script>
</body>
</html>
▶ جرّب الكود
💡 تلميح: Math.random() يُنتج أرقام pseudo-random وغير مناسب لأغراض التشفير. للعشوائية الآمنة cryptographically، استخدم crypto.getRandomValues().



❓ أسئلة شائعة

س ما قيمة Math.round(2.5) وMath.round(-2.5) على التوالي؟
ج Math.round(2.5) هو 3، وMath.round(-2.5) هو -2. عندما يكون العشري بالضبط .5، يقرب جافاسكريبت نحو اللانهاية الموجبة —🦄 كلا الأعداد الموجبة والسالبة تقرب للأعلى (أقرب إلى 0).
س كيف أتحقق مما إذا كانت القيمة رقمًا صالحًا ومحدودًا؟
ج استخدم Number.isFinite(value). يستثني NaN وInfinity و-Infinity، كما يرفض الأنواع غير الرقمية. isFinite() العالمي يعمل أيضًا لكنه لا يتحقق من النوع (يُجري الإكراه أولاً).
س ما الفرق بين parseInt وNumber()؟
ج parseInt('12abc') يُرجع 12 — يحلل من اليسار لليمين حتى لا يستطيع المتابعة. Number('12abc') يُرجع NaN — يجب أن يكون النص بالكامل رقمًا صالحًا. استخدم parseInt للتحليل المتساهل وNumber() للتحويل الصارم.

📖 ملخص

📝 تمارين

  1. اكتب برنامجًا يأخذ نصف قطر دائرة كمدخل، يحسب مساحتها ومحيطها، ويعرض النتائج مقربة إلى خانتين عشريتين.
  2. اكتب لعبة تخمين أرقام: يُنشئ البرنامج عددًا صحيحًا عشوائيًا بين 1 و100، يُدخل المستخدم تخمينات، ويستجيب البرنامج بـ "مرتفع جدًا" أو "منخفض جدًا" حتى يُعثر على الإجابة الصحيحة.
  3. اكتب محوّل قواعد: أدخل رقمًا عشريًا واعرض في نفس الوقت ما يعادله ثنائيًا وثمانيًا وسداسي عشريًا.
Web-Tutorial.com

فريق Web-Tutorial التقني

منصة دروس برمجية يديرها عدة مطورين. كل درس يتم كتابته ومراجعته بواسطة مطورين متخصصين في المجال. نعمل على ضمان دقة وموثوقية المحتوى — إذا لاحظت أي مشكلة، فيرجى إخبارنا.

100%