EnglishEnglish العربيةالعربية PortuguêsPortuguês 日本語日本語
404 Not Found

404 Not Found

nginx

عوامل جافاسكريبت

العوامل هي رموز تخبر جافاسكريبت بأي عملية تنفيذ. تستخدم + للجمع كل يوم، لكن عوامل JS تتجاوز الحسابيات بكثير — التعيين، والمقارنة، والتقييم المنطقي كلها تعتمد عليها. هذا الدرس يغطي أكثر العوامل استخدامًا دفعة واحدة.

العوامل الحسابية

العامل المعنى مثال
+ جمع 5 + 3 → 8
- طرح 5 - 3 → 2
* ضرب 5 * 3 → 15
/ قسمة 6 / 3 → 2
% باقي 7 % 3 → 1
** أس 2 ** 3 → 8
++ زيادة x++ أو ++x
-- نقصان x-- أو --x

عامل الباقي % مفيد بشكل خاص — التحقق من فردي/زائد، والالتفاف في الحلقات، والمزيد. ** هو عامل الأس المُضاف في ES2016، يعادل Math.pow() لكنه أكثر اختصارًا.

الفرق بين البادئ واللاحق ++ / --: البادئ يغير أولاً ثم يُرجع، اللاحق يُرجع أولاً ثم يغير. لا تسلسل عدة ++ على نفس السطر — يصبح الكود لغزًا غير مقروء.

مثال: أساسيات العوامل الحسابية

HTML 
<!DOCTYPE html>
<html lang="ar">
<head>
  <meta charset="UTF-8">
  <title>العوامل الحسابية</title>
</head>
<body>
  <h3>عرض العوامل الحسابية</h3>
  <pre id="output"></pre>
  <script>
    var out = document.getElementById('output');
    var a = 17, b = 5;

    var lines = [];
    lines.push('a = ' + a + ', b = ' + b);
    lines.push('a + b  = ' + (a + b));
    lines.push('a - b  = ' + (a - b));
    lines.push('a * b  = ' + (a * b));
    lines.push('a / b  = ' + (a / b));
    lines.push('a % b  = ' + (a % b));
    lines.push('a  b = ' + (a  b));

    var x = 10;
    lines.push('');
    lines.push('x = 10');
    lines.push('x++  = ' + (x++) + '  (لاحق: يُرجع القيمة القديمة، x يصبح ' + x + ')');
    lines.push('++x  = ' + (++x) + '  (بادئ: يغير أولاً، x يصبح ' + x + ')');

    out.textContent = lines.join('\n');
  </script>
</body>
</html>
▶ جرّب الكود

عوامل التعيين

= هو تعيين، وليس "يساوي" بالمعنى الرياضي. هذا أحد أكثر فخاخ المبتدئين شيوعًا — if (x = 5) لن يُلقي خطأ؛ إنه يُعيّن 5 لـ x ويُرجع 5 (قيمة صحيحة)،所以他 الشرط دائمًا صحيح.

التعيين المركب هو اختصار:

الاختصار المعادل
x += 5 x = x + 5
x -= 3 x = x - 3
x *= 2 x = x * 2
x /= 4 x = x / 4
x %= 3 x = x % 3

مثال: عوامل التعيين

HTML 
<!DOCTYPE html>
<html lang="ar">
<head>
  <meta charset="UTF-8">
  <title>عوامل التعيين</title>
</head>
<body>
  <h3>عرض عوامل التعيين</h3>
  <pre id="output"></pre>
  <script>
    var out = document.getElementById('output');
    var lines = [];

    var score = 80;
    lines.push('الدرجة الأولية = ' + score);

    score += 10;
    lines.push('score += 10 → ' + score);

    score -= 25;
    lines.push('score -= 25 → ' + score);

    score *= 2;
    lines.push('score *= 2  → ' + score);

    score /= 3;
    lines.push('score /= 3  → ' + score.toFixed(1));

    score %= 30;
    lines.push('score %= 30 → ' + score.toFixed(1));

    out.textContent = lines.join('\n');
  </script>
</body>
</html>
▶ جرّب الكود

عوامل المقارنة

العامل المعنى
== تساوي متساهل (يُجري إكراه الأنواع)
=== تساوي صارم (لا إكراه للأنواع)
!= عدم تساوي متساهل
!== عدم تساوي صارم
> أكبر من
< أصغر من
>= أكبر من أو يساوي
<= أصغر من أو يساوي

⚠️ فخ == مقابل ===: هذا هو أكثر فخاخ جافاسكريبت كلاسيكية، بلا منازع. == يُجري إكراه الأنواع بصمت — "5" == 5 هو true! بينما === يتطلب تطابق النوع والقيمة — "5" === 5 هو false. استخدم دائمًا === إلا إذا كنت تحتاج تحديدًا إلى إكراه الأنواع. كذلك، استخدم !== بدلاً من !=.

مثال: فخ == مقابل ===

HTML 
<!DOCTYPE html>
<html lang="ar">
<head>
  <meta charset="UTF-8">
  <title>== مقابل ===</title>
</head>
<body>
  <h3>التساوي المتساهل مقابل التساوي الصارم</h3>
  <pre id="output"></pre>
  <script>
    var out = document.getElementById('output');
    var lines = [];

    lines.push('"5" == 5   → ' + ("5" == 5));
    lines.push('"5" === 5  → ' + ("5" === 5));
    lines.push('');
    lines.push('0 == false   → ' + (0 == false));
    lines.push('0 === false  → ' + (0 === false));
    lines.push('');
    lines.push('"" == false  → ' + ("" == false));
    lines.push('"" === false → ' + ("" === false));
    lines.push('');
    lines.push('null == undefined  → ' + (null == undefined));
    lines.push('null === undefined → ' + (null === undefined));
    lines.push('');
    lines.push('5 != "5"   → ' + (5 != "5"));
    lines.push('5 !== "5"  → ' + (5 !== "5"));

    out.textContent = lines.join('\n');
  </script>
</body>
</html>
▶ جرّب الكود

هل رأيت؟ 0 == false و"" == false كلاهما true — غير منطقي تمامًا. إنها مثل تفاح وبرتقال: == يقول "كلاهما فاكهة، قريب بما فيه الكفاية"; === يقول "ليسوا متماثلين، نقطة". الزم === وستتجنب نصف أخطائك.

العوامل المنطقية

العامل المعنى الوصف
&& AND صحيح فقط عندما يكون كلا الجانبين صحيحًا
|| OR صحيح عندما يكون أي جانب صحيحًا
! NOT ينفي القيمة

&& و|| لديهما ميزة مفيدة تسمى التقييم المختصر: && يتوقف عند أول قيمة خاطئة، || يتوقف عند أول قيمة صحيحة — الباقي لا يُقيَّم أبدًا. يُستخدم عادةً لتعيينات شرطية مختصرة:

HTML 
<script>
var name = userInput || 'مجهول';
</script>

مثال: العوامل المنطقية والتقييم المختصر

HTML 
<!DOCTYPE html>
<html lang="ar">
<head>
  <meta charset="UTF-8">
  <title>العوامل المنطقية</title>
</head>
<body>
  <h3>عرض العوامل المنطقية</h3>
  <pre id="output"></pre>
  <script>
    var out = document.getElementById('output');
    var lines = [];

    var age = 20;
    var hasTicket = true;

    lines.push('age = ' + age + ', hasTicket = ' + hasTicket);
    lines.push('age >= 18 && hasTicket → ' + (age >= 18 && hasTicket));
    lines.push('age >= 18 || hasTicket → ' + (age >= 18 || hasTicket));
    lines.push('!hasTicket          → ' + (!hasTicket));
    lines.push('');

    lines.push('--- التقييم المختصر ---');
    lines.push('1 && "hello"  → ' + (1 && "hello"));
    lines.push('0 && "hello"  → ' + (0 && "hello"));
    lines.push('1 || "hello"  → ' + (1 || "hello"));
    lines.push('0 || "hello"  → ' + (0 || "hello"));
    lines.push('');

    var username = '';
    var displayName = username || 'ضيف';
    lines.push('نص فارغ || "ضيف" → ' + displayName);

    out.textContent = lines.join('\n');
  </script>
</body>
</html>
▶ جرّب الكود

عامل + مع النصوص

عندما يواجه + نصًا، يصبح عامل ربط: طالما أن أحد الجانبين نصًا، يتحول الجانب الآخر إلى نص ويُربطان معًا.

HTML 
<script>
"مرحبا" + " " + "عالم"   // "مرحبا عالم"
"رقم: " + 42            // "رقم: 42"
3 + 4 + "بكسل"              // "7بكسل" (3+4=7 أولاً، ثم يُربط)
"بكسل" + 3 + 4              // "بكسل34" (من اليسار لليمين: "بكسل"+3="بكسل3"، ثم +4)
</script>

هذا "بكسل" + 3 + 4 يُعطي "بكسل34" بدلاً من "بكسل7" هو فخ مقابلة كلاسيكي — + يُقيّم من اليسار لليمين، وبمجرد أن يصبح الجانب الأيسر نصًا، يصبح كل ما بعده ربطًا.

نظرة عامة على العامل الثلاثي

العامل الثلاثي هو اختصار لـ if...else، بالبناء: condition ? value1 : value2.

HTML 
<script>
var status = age >= 18 ? 'بالغ' : 'قاصر';
</script>

إذا كان الشرط صحيحًا، يُرجع value1؛ وإلا value2. الشروط البسيطة تعمل بشكل أنيق مع العامل الثلاثي، لكن لا تعشّقها — a ? b ? c : d : e هو وصفة للارتباك. الاستخدام التفصيلي يُغطى في الدرس 10.

أولوية العوامل

تحدد جافاسكريبت أمر التقييم بناءً على الأولوية، متبعًا نفس القواعد التي تعلمتها في حصة الرياضيات: الضرب والقسمة قبل الجمع والطرح، والأقواس أولاً.

HTML 
<script>
2 + 3 * 4     // 14، وليس 20
(2 + 3) * 4   // 20
</script>

الأولوية الشائعة من الأعلى إلى الأدنى: () → ! → ** → * / % → + - → > < >= <= → == === != !== → && → || → ?: → =.

عند الشك، أضف أقواسًا. الأقواس مجانية، لكن الأخطاء مكلفة.

📖 ملخص

❓ أسئلة شائعة

س لماذا يُعطي "1" + 2 + 3 "123" بدلاً من "15"؟
ج + يُقيّم من اليسار لليمين. "1" + 2 يُنتج النص "12"، ثم "12" + 3 يُعطي "123". لإضافة الأرقام أولاً، استخدم الأقواس: "1" + (2 + 3) يُعطي "15".
س لماذا 0 == false صحيح؟
ج == يُجري إكراه الأنواع قبل المقارنة. كلا 0 وfalse يتحولان إلى الرقم 0،所以他ما متساويان. لهذا يُوصى بـ === — لا يُجري إكراه،所以他 0 === false هو false.
س ما الفرق بين x++ و++x؟
ج عند استخدامهما بمفردهما، كلاهما يزيد x بمقدار 1. الفرق في قيمة إرجاع التعبير: x++ يُرجع القيمة القديمة قبل الزيادة، ++x يُرجع القيمة الجديدة بعد الزيادة. على سبيل المثال، var a = 5; var b = a++; يُعطي a=6، b=5; بينما var a = 5; var b = ++a; يُعطي a=6، b=6.

📝 تمارين

  1. اكتب برنامجًا يأخذ عددًا من ثلاثة أرقام (مثل 371) ويستخرج المئات والعشرات والآحاد باستخدام % و/، ثم يطبعها.
  2. بدون استخدام if...else، اكتب سطرًا واحدًا باستخدام العامل الثلاثي لتحديد ما إذا كانت سنة year سنة كبيسة، وعيّن النتيجة في isLeap (تلميح: قابلة للقسمة على 4 وليس على 100، أو قابلة للقسمة على 400).
  3. توقع نتائج التعبيرات التالية، ثم تحقق في وحدة تحكم المتصفح: [] == false، [] == ![]، null == 0. اشرح لماذا — إذا لم تستطع،这意味着 تحتاج لمراجعة قواعد الإكراه الضمني لـ ==، ثم احتضن === بقوة.
100%