الفرق بين Var و Let و Const في JavaScript

x32x01
  • بواسطة x32x01 ||
لو انت لسه بادئ في JavaScript، أكيد سمعت عن الكلمات المفتاحية var, let, و const. بس تعرف الفرق بينهم إيه بالظبط؟ 🤔
في البوست ده هنتكلم بطريقة سهلة وبأمثلة واضحة عن كل واحد فيهم، وكمان هتشوف ازاي تستخدمهم صح في مشاريعك.

إيه هي Var و Let و Const؟ 🔑

الكلمات دي (var, let, const) هي المسؤولة عن إنشاء المتغيرات في JavaScript.
في ES6 (المعيار الحديث للغة)، ظهر let و const علشان يحسنوا طريقة كتابة الكود ويخلوها أقرب للغات البرمجة التانية زي C# أو Java.

يعني باختصار:
  • var قديمة شوية ومرنة جدًا.
  • let ظهرت حديثًا لتنظيم المتغيرات وحمايتها من الأخطاء.
  • const للثوابت اللي مش عايز قيمتها تتغير.



Var في JavaScript 🟢


1- Redeclare المتغيرات​

ممكن تعيد تعريف var أكتر من مرة بدون أي مشكلة:
JavaScript:
var x = 1;
var x = 2;

console.log(x); // 2
زي ما انت شايف، القيمة الأخيرة هي اللي هتظهر.

2- الوصول للمتغير قبل تعريفه (Access Before Declare) 🕵️‍♂️

لو حاولت تستخدم var قبل ما تعرفه، هيديك undefined مش Error:
JavaScript:
console.log(a); // undefined
var a = 10;

3- Var مش Block Scoped ❌

يعني لو معرفت var جوه شرط أو حلقة، ممكن تستخدمه براهم:
JavaScript:
var x = 10;

if(x == 10){
    var x = 20;
    console.log(x); // 20
}

console.log(x); // 20
زي ما شايف، القيمة اتغيرت برا الـ if كمان.

4- Var تابع للـ Function Scoped 🛠️

المتغير يكون متاح جوا الـ function بس، براها مش هينفع:
JavaScript:
function Example(){
    if(true){
        var x = 5;
    }
    console.log(x); // 5
}

Example();

console.log(x); // Error



Let في JavaScript 🟡


1- مينفعش Redeclare ❌

لو حاولت تعيد تعريف let هيدي Error:
JavaScript:
let x = 1;
let x = 2;

console.log(x); // Error

2- Access Before Declare ❌

لو استخدمت المتغير قبل تعريفه هيدي Error مش undefined:
JavaScript:
console.log(a); // a is not defined
let a = 10;

3- Let Block Scoped ✅

يعني المتغير متاح جوه الـ block اللي اتعرف فيه بس:
JavaScript:
let x = 10;

if(x == 10){
    let x = 20;
    console.log(x); // 20
}

console.log(x); // 10

4- Let Function Scoped​

مش هينفع تستخدمه برا الـ function:
JavaScript:
function Example(){
    if(true){
        let x = 5;
    }
    console.log(x); // Error
}

Example();



Const في JavaScript 🔵

Const زي let بالظبط من ناحية الـ scope، بس الفرق إنه ثابت.
يعني مينفعش تغير قيمته بعد تعريفه.
JavaScript:
const x = 10;
x = 20; // Error

1- مينفعش Redeclare​

زي الـ let، متقدرش تعمل redeclare للمتغير.

2- Access Before Declare​

لو استخدمت قبل التعريف هيطلع Error.

3- Const Block Scoped و Function Scoped​

زي الـ let تمام، ممكن تستخدمه جوا blocks أو functions بس مش براهم.



الخلاصة: إيه اللي تستخدمه وإمتى؟ 🤓

  • استخدم var بس لو شغال على كود قديم أو مع legacy projects.
  • استخدم let لما عايز متغير قابل للتغيير جوه block أو function.
  • استخدم const للثوابت اللي قيمتها مش هتتغير طول الكود.



مثال عملي على Var vs Let vs Const 💡

JavaScript:
var nameVar = "Ahmed";
let nameLet = "Sara";
const nameConst = "Ali";

// تغيير القيم
nameVar = "Mostafa"; // تمام
nameLet = "Mona"; // تمام
nameConst = "Omar"; // Error

console.log(nameVar); // Mostafa
console.log(nameLet); // Mona
console.log(nameConst); // Error



نصايح سريعة للمبتدئين 🚀

  1. دايمًا حاول تستخدم let بدل var لتجنب الأخطاء.
  2. استخدم const للثوابت، ده بيخلي كودك أكثر أمان.
  3. ركز على ES6 وابتعد عن الطرق القديمة لو ممكن.
  4. جرب الأمثلة عملي على المتصفح أو Node.js عشان تثبت المعلومات.
 
التعديل الأخير:
  • أحببته
التفاعلات: Chemseddine
المواضيع ذات الصلة
x32x01
الردود
0
المشاهدات
669
x32x01
x32x01
x32x01
الردود
0
المشاهدات
631
x32x01
x32x01
x32x01
الردود
0
المشاهدات
617
x32x01
x32x01
x32x01
الردود
0
المشاهدات
962
x32x01
x32x01
x32x01
الردود
0
المشاهدات
634
x32x01
x32x01
x32x01
الردود
0
المشاهدات
362
x32x01
x32x01
x32x01
الردود
0
المشاهدات
399
x32x01
x32x01
x32x01
الردود
0
المشاهدات
733
x32x01
x32x01
x32x01
الردود
0
المشاهدات
479
x32x01
x32x01
x32x01
الردود
0
المشاهدات
643
x32x01
x32x01
الدخول أو التسجيل السريع
نسيت كلمة مرورك؟
إحصائيات المنتدى
المواضيع
1,830
المشاركات
2,027
أعضاء أكتب كود
466
أخر عضو
chaouki
عودة
أعلى