العوامل في لغة JavaScript

العوامل في لغة JavaScript

أهلاً يا جماعة، اليوم بنتكلم عن العوامل (Operators) في JavaScript. الموضوع بسيط ومهم جداً، هو أساس أي عملية حسابية أو منطقية بتسويها في الكود حقك.

1. العوامل الحسابية (Arithmetic Operators)

هذي اللي نستخدمها للعمليات الحسابية المعروفة:

• + (الجمع)
• - (الطرح)
• * (الضرب)
• / (القسمة)
• % (باقي القسمة - Modulus)
• ** (الأس - Exponentiation)
• ++ (زيادة بواحد - Increment)
• -- (نقصان بواحد - Decrement)

ملاحظة: ++ و -- ممكن تجي قبل المتغير (prefix) أو بعده (postfix)، والفرق هو متى يتم تطبيق الزيادة/النقصان.

مثال:

let x = 10;
    let y = 3;
    console.log(x + y); // 13
    console.log(x % y); // 1
    console.log(x ** y); // 1000
    x++;
    console.log(x); // 11

2. عوامل الإسناد (Assignment Operators)

تستخدم لإسناد القيم للمتغيرات:

• = (إسناد قيمة)
• += (إضافة وإسناد)
• -= (طرح وإسناد)
• *= (ضرب وإسناد)
• /= (قسمة وإسناد)
• %= (باقي قسمة وإسناد)
• **= (أس وإسناد)

مثال:

let a = 5;
    a += 3; // نفس <code dir="ltr" style="background:#f3f4f6; color:#0056b3; padding:2px 6px; border-radius:4px; font-family:monospace; direction:ltr !important; display:inline-block;">a = a + 3;</code>، الآن <code dir="ltr" style="background:#f3f4f6; color:#0056b3; padding:2px 6px; border-radius:4px; font-family:monospace; direction:ltr !important; display:inline-block;">a</code> قيمتها 8
    console.log(a); // 8
    a *= 2; // نفس <code dir="ltr" style="background:#f3f4f6; color:#0056b3; padding:2px 6px; border-radius:4px; font-family:monospace; direction:ltr !important; display:inline-block;">a = a * 2;</code>، الآن <code dir="ltr" style="background:#f3f4f6; color:#0056b3; padding:2px 6px; border-radius:4px; font-family:monospace; direction:ltr !important; display:inline-block;">a</code> قيمتها 16
    console.log(a); // 16

3. عوامل المقارنة (Comparison Operators)

هذي تقارن بين قيمتين وترجع true أو false:

• == (يساوي - يقارن القيمة فقط)
• === (يساوي تماماً - يقارن القيمة والنوع)
• != (لا يساوي - يقارن القيمة فقط)
• !== (لا يساوي تماماً - يقارن القيمة والنوع)
• > (أكبر من)
• < (أصغر من)
• >= (أكبر من أو يساوي)
• <= (أصغر من أو يساوي)

نصيحة: دائماً استخدم === و !== عشان تتجنب المشاكل اللي تصير بسبب تحويل الأنواع (Type Coercion) في JavaScript.

مثال:

console.log(5 == '5');   // true (يقارن القيمة فقط)
    console.log(5 === '5');  // false (يقارن القيمة والنوع)
    console.log(10 > 5);     // true

4. العوامل المنطقية (Logical Operators)

تستخدم للتعامل مع القيم المنطقية true و false:

• && (AND - و): ترجع true إذا كانت كلتا القيمتين true.
• || (OR - أو): ترجع true إذا كانت إحدى القيمتين أو كلاهما true.
• ! (NOT - لا): تعكس القيمة المنطقية.

مثال:

let age = 20;
    let hasLicense = true;
    console.log(age >= 18 && hasLicense); // true
    console.log(age < 18 || !hasLicense); // false

5. عامل الشرط الثلاثي (Ternary Operator)

هذا عامل مختصر لجملة if/else، ويأخذ 3 أجزاء: condition ? exprIfTrue : exprIfFalse

مثال:

let isAdult = (age >= 18) ? "بالغ" : "غير بالغ";
    console.log(isAdult); // بالغ

6. عامل النوع (Typeof Operator)

يرجع نوع البيانات كـ string.

مثال:

console.log(typeof "مرحباً"); // "string"
    console.log(typeof 123);    // "number"
    console.log(typeof true);   // "boolean"
    console.log(typeof undefined); // "undefined"
    console.log(typeof null);   // "object" (هذا خطأ قديم في JS، لكنه موجود)

7. عامل التجميع الصفري (Nullish Coalescing Operator - ??)

هذا عامل جديد نسبياً ومفيد. يرجع القيمة اليمنى إذا كانت القيمة اليسرى null أو undefined. بخلاف || اللي يرجع القيمة اليمنى إذا كانت اليسرى "falsy" (مثل 0، ''، false).

مثال:

let name = null;
    let user = name ?? "ضيف";
    console.log(user); // "ضيف"

    let count = 0;
    let actualCount = count ?? 10; // 0 (لأن 0 ليست null ولا undefined)
    console.log(actualCount); // 0

    let defaultCount = count || 10; // 10 (لأن 0 هي falsy بالنسبة لـ ||)
    console.log(defaultCount); // 10

8. عامل السلسلة الاختيارية (Optional Chaining Operator - ?.)

برضو هذا جديد ومفيد جداً! يسمح لك بالوصول لخصائص كائن (object) بدون ما تتسبب في خطأ إذا كان الكائن أو إحدى خصائصه null أو undefined. يرجع undefined بدلاً من الخطأ.

مثال:

const userProfile = {
        name: "علي",
        address: {
            city: "الرياض"
        }
    };

    console.log(userProfile.address?.city);    // "الرياض"
    console.log(userProfile.contact?.email);   // undefined (بدون خطأ)

    const anotherUser = null;
    console.log(anotherUser?.name); // undefined

الخلاصة

هذي كانت نظرة سريعة على أهم العوامل في JavaScript. فهمها وإتقانها بيسرّع عليك الشغل ويخلي كودك أنظف وأكثر فعالية. طبقوا الأمثلة عشان تثبت المعلومة!

← السابقالفهرسالتالي →