هذا التدريب التفاعلي سيساعدك على إتقان مكونات JavaScript الأساسية من خلال:
المكونات الأساسية في JavaScript هي اللبنات الأساسية التي تُبنى منها كل البرامج والتطبيقات. مثلما تُبنى المنازل من الطوب والإسمنت، تُبنى تطبيقات JavaScript من هذه المكونات الأساسية التي تشكل أساس اللغة وتسمح بتنفيذ العمليات البرمجية.
المتغيرات هي حاويات تخزين للبيانات في الذاكرة. يمكن تخزين أي نوع من البيانات في المتغيرات باستخدام ثلاثة طرق للإعلان:
// طرق تعريف المتغيرات
var name = "أحمد"; // الطريقة القديمة (نطاق دالي)
let age = 25; // للمتغيرات المتغيرة (نطاق كتلي)
const PI = 3.14; // للمتغيرات الثابتة
// الفرق الرئيسي بين let و const
age = 26; // ✅ مسموح (يمكن تغيير قيمة let)
// PI = 3.15; // ❌ خطأ! لا يمكن تغيير قيمة const
نصيحة مهمة: استخدم const بشكل افتراضي، واستخدم let فقط عندما تحتاج لتغيير القيمة.
JavaScript تحتوي على أنواع بيانات متعددة تنقسم إلى فئتين رئيسيتين:
// أمثلة على أنواع البيانات
let text = "مرحبا بالعالم"; // String
let number = 42; // Number
let isActive = true; // Boolean
let person = { // Object
name: "أحمد",
age: 25
};
let colors = ["أحمر", "أخضر", "أزرق"]; // Array
المعاملات هي رموز تقوم بعمليات على القيم والمتغيرات. تنقسم إلى عدة أنواع:
// أمثلة على المعاملات
let x = 10 + 5; // 15 (جمع)
let y = 20 * 2; // 40 (ضرب)
let isEqual = (5 == "5"); // true (تحويل تلقائي)
let isStrictEqual = (5 === "5"); // false (بدون تحويل)
let result = (10 > 5) && (3 < 7); // true (و منطقية)
x += 5; // تصبح x = 20 (إضافة وتعيين)
let message = (age >= 18) ? "بالغ" : "قاصر"; // معامل شرطي
الدوال هي كتل من الكود يمكن تعريفها واستدعاؤها بأسماء، مما يجعل الكود أكثر تنظيماً وإعادة استخدام.
// طرق تعريف الدوال
// 1. تعريف دالة تقليدية
function greet(name) {
return "مرحبا " + name;
}
// 2. تعبير دالة (Function Expression)
const add = function(a, b) {
return a + b;
};
// 3. الدوال السهمية (Arrow Functions) - ES6+
const multiply = (a, b) => a * b;
// 4. الدوال المجهولة (Anonymous Functions)
setTimeout(function() {
console.log("تم التنفيذ بعد 2 ثانية");
}, 2000);
// استدعاء الدوال
console.log(greet("أحمد")); // "مرحبا أحمد"
console.log(add(5, 3)); // 8
console.log(multiply(4, 6)); // 24
النطاق هو المنطقة التي يمكن فيها الوصول إلى متغير معين في الكود. فهم النطاق أمر بالغ الأهمية لتجنب الأخطاء.
let globalVar = "أنا عام"; // نطاق عام
function testScope() {
var functionVar = "أنا دالي"; // نطاق دالي
console.log(globalVar); // ✅ يمكن الوصول
console.log(functionVar); // ✅ يمكن الوصول
if (true) {
let blockVar = "أنا كتلي"; // نطاق كتلي
console.log(blockVar); // ✅ يمكن الوصول
}
// console.log(blockVar); // ❌ خطأ! لا يمكن الوصول خارج الكتلة
}
testScope();
// console.log(functionVar); // ❌ خطأ! لا يمكن الوصول خارج الدالة