📝 فهم بناء الجملة (Syntax) في JavaScript: دليلك الشامل للبدء

مرحباً بك في عالم JavaScript! 🎉 بناء الجملة، أو الـ Syntax، هو مجموعة القواعد التي تحدد كيفية كتابة الكود بشكل صحيح ليتمكن المتصفح من فهمه وتنفيذه. فكر فيه كقواعد اللغة العربية التي تنظم تكوين الجملة من فعل وفاعل ومفعول به. بدون اتباع هذه القواعد، لن يفهم المتصفح ما تطلبه منه!

🔤 ما هو بناء الجملة (Syntax)؟

بناء الجملة (Syntax) في JavaScript يشبه تماماً قواعد اللغة. هو الهيكل الأساسي الذي يجب أن يتبعه الكود الذي تكتبه. إذا اتبعت القواعد، سيعمل الكود بسلاسة. إذا أخطأت فيها، فسيظهر خطأ (Error) ولن يعمل البرنامج.

  • مثال بسيط: تخيل أنك تقول لصديقك: "أريد أن تشتري لي تفاحة". هذه جملة صحيحة النحو. ولكن إذا قلت: "تفاحة لي تشتري أريد"، فلن يفهمك صديقك! الأمر نفسه ينطبق على JavaScript.
// ✅ هذا كود صحيح من حيث الـ Syntax
console.log("مرحباً بالعالم!");

// ❌ هذا كود خاطئ من حيث الـ Syntax (سيتسبب في خطأ)
consolelog("مرحباً بالعالم!");
// لاحظ أن النقطة الفاصلة (.) مفقودة بين console و log

📌 القواعد الأساسية لبناء الجملة في JavaScript

لنبدأ بأهم القواعد التي يجب أن تعرفها لتكتب كود JavaScript صحيح.

1. الحساسية لحالة الأحرف (Case Sensitivity)

JavaScript لغة حساسة لحالة الأحرف. هذا يعني أن المتغير myVariable يختلف تماماً عن myvariable أو MYVARIABLE.

let greeting = "Hello"; // ✅ متغير باسم greeting
console.log(greeting); // ✅ هذا سيعمل ويطبع Hello

console.log(Greeting); // ❌ خطأ! المتغير Greeting غير معرف (مختلف عن greeting)

2. المسافات البيضاء (Whitespace)

تتجاهل JavaScript المسافات البيضاء (مسافات، أسطر جديدة) الزائدة. هذا يعني أنه يمكنك استخدام المسافات لجعل الكود أكثر قابلية للقراءة دون أن يؤثر على التنفيذ.

// ✅ الكودان التاليان متطابقان في التنفيذ

let x=5;
let y=10;

let a = 5;
let b = 10;

3. الفواصل المنقوطة (Semicolons) ;

الفاصلة المنقوطة ; تُستخدم لإنهاء جملة JavaScript. بينما أصبح من الشائع إلغاؤها (لأن JavaScript تضيفها تلقائياً في معظم الحالات)، فإن استخدامها يعد ممارسة جيدة لتجنب الأخطاء غير المتوقعة، خاصة للمبتدئين.

// ✅ استخدام الفاصلة المنقوطة هو الأكثر أماناً
let name = "أحمد";
console.log(name);

4. التعليقات (Comments)

التعليقات هي notes تضعها في الكود لشرح ما يفعله. يتجاهلها المتصفح تماماً ولا تنفذ. وهي ضرورية لجعل الكود مفهوماً لك وللآخرين.

  • تعليق من سطر واحد: يبدأ ب //
  • تعليق متعدد الأسطر: يبدأ ب /* وينتهي ب */
// هذا تعليق على سطر واحد. يشرح السطر التالي.
let age = 25; // هذا تعليق بجانب الكود

/*
هذا تعليق طويل
يمتد على عدة أسطر.
مفيد لشرح فكرة معقدة.
*/

🧱 لبنات بناء الجملة الأساسية

1. المتغيرات (Variables)

المتغيرات مثل الصناديق التي تخزن البيانات. نستخدم الكلمات المفتاحية let أو const لإنشائها.

// إنشاء متغير باستخدام let (قابل للتغيير)
let userName = "Sara";
userName = "Noura"; // ✅ يمكن تغيير قيمته

// إنشاء متغير باستخدام const (ثابت لا يتغير)
const birthYear = 2000;
// birthYear = 2001; // ❌ خطأ! لا يمكن تغيير قيمة const

2. أنواع البيانات (Data Types)

لكل قيمة نوع. الأنواع الأساسية هي:

  • نصي (String): "هذا نص"
  • رقمي (Number): 10 أو 3.14
  • منطقي (Boolean): true أو false
let courseName = "JavaScript"; // String
let lessonNumber = 5; // Number
let isCompleted = false; // Boolean

3. العوامل (Operators)

رموز لإجراء عمليات على القيم.

// عوامل حسابية
let sum = 5 + 3; // 8
let product = 4 * 2; // 8

// عامل التساوي (للمقارنة)
let isEqual = (5 == 5); // true

4. الجمل الشرطية (If Statements)

تستخدم لاتخاذ قرارات في الكود.

let time = 14;

if (time < 12) {
    console.log("صباح الخير!");
} else {
    console.log("مساء الخير!");
}
// ستكون النتيجة: "مساء الخير!" لأن 14 أكبر من 12

5. الحلقات (Loops)

تكرر تنفيذ كتلة من الكود.

// هذه الحلقة تطبع الأرقام من 1 إلى 5
for (let i = 1; i <= 5; i++) {
    console.log("الرقم هو: " + i);
}

6. الدوال (Functions)

كتلة من الكود يمكن استدعاؤها بأسمها.

// تعريف دالة
function sayHello() {
    console.log("أهلاً وسهلاً!");
}

// استدعاء الدالة لتنفيذ الكود بداخلها
sayHello(); // ستطبع "أهلاً وسهلاً!"

🚀 خلاصة

تهانينا! 🎓 لقد تعلمت الأساسيات المتينة لبناء الجملة في JavaScript. تذكر أن المفتاح هو الممارسة. اكتب الأكواد البسيطة بنفسك، وجربها، ولا تخف من ارتكاب الأخطاء؛ فمن خلالها تتعلم.