8- ما هي الكلمة المفتاحية let في جافاسكريبت؟

مقدمة
تم تقديم كلمة المفتاح let في إصدار ES6 (2015) من لغة جافاسكريبت. المتغيرات المعلنة باستخدام let تمتلك نطاق كتلة محلي. يجب إعلان المتغيرات المعلنة باستخدام let قبل استخدامها. لا يمكن إعادة إعلان المتغيرات المعلنة باستخدام let داخل نفس النطاق.
نطاق الكتلة
قبل إصدار ES6 (2015)، لم يكن لدى لغة جافاسكريبت نطاق كتلة محلي. كانت تمتلك نطاقًا عالميًا ونطاقًا محليًا داخل الدوال. قدم إصدار ES6 كلمتي المفتاح الجديدتين: let و const. هاتان الكلمتان أضافتا نطاق الكتلة المحلي إلى لغة جافاسكريبت.
مثال
المتغيرات المعلنة داخل كتلة { } لا يمكن الوصول إليها من خارج هذه الكتلة:
{
let x = 2;
}
// x can NOT be used hereGlobal Scope
المتغيرات المعلنة باستخدام الكلمة المفتاحية var لها دائماً نطاق عالمي. المتغيرات المعلنة باستخدام الكلمة المفتاحية var لا يمكن أن يكون لها نطاق كتلة:
مثال:
المتغيرات المعلنة باستخدام var داخل كتلة {} يمكن الوصول إليها من خارج الكتلة:
{
var x = 2;
}
// x CAN be used hereلا يمكن إعادة إعلانها
المتغيرات المعرفة باستخدام let لا يمكن إعادة إعلانها. لا يمكنك إعادة إعلان متغير معلن باستخدام let عن طريق الخطأ. مع let لا يمكنك فعل ذلك:
let x = "John Doe";
let x = 0;
المتغيرات المعرفة باستخدام var يمكن إعادة إعلانها. مع var يمكنك فعل ذلك:
var x = "John Doe";
var x = 0;
إعادة إعلان المتغيرات
إعادة إعلان متغير باستخدام الكلمة المفتاحية var يمكن أن يفرض مشاكل. إعادة إعلان متغير داخل كتلة ستعيد أيضًا إعلان المتغير خارج الكتلة:
مثال:
var x = 10;
// Here x is 10
{
var x = 2;
// Here x is 2
}
// Here x is 2
إعادة إعلان متغير باستخدام الكلمة المفتاحية let يمكن أن يحل هذه المشكلة. إعادة إعلان متغير داخل كتلة لن يعيد إعلان المتغير خارج الكتلة:
مثال:
let x = 10;
// Here x is 10
{
let x = 2;
// Here x is 2
}
// Here x is 10
الفرق بين var و let و const
| Scope | Redeclare | Reassign | Hoisted | Binds this |
|---|---|---|---|---|
| var | نعم | نعم | نعم | نعم |
| let | لا | نعم | لا | لا |
| const | لا | لا | لا | لا |
ما هو جيد؟
letوconstلهما نطاق كتلة.- لا يمكن إعادة إعلان
letوconst. - يجب إعلان
letوconstقبل الاستخدام. letوconstلا يرتبطان بـthis.letوconstغير مرفوعات.
ما هو غير جيد؟
varلا يجب أن يتم إعلانه.varمرفوع.varيرتبط بـthis.
دعم المتصفح
كلمات المفتاح let و const غير مدعومة في Internet Explorer 11 أو إصدارات أقدم. يوضح الجدول التالي أول إصدارات المتصفحات التي تدعمها بالكامل:
| المتصفح | الإصدار | التاريخ |
|---|---|---|
| Chrome | 49 | مارس، 2016 |
| Edge | 12 | يوليو، 2015 |
| Firefox | 36 | يناير، 2015 |
| Safari | 11 | سبتمبر، 2017 |
| Opera | 36 | مارس، 2016 |
إعادة الإعلان (Redeclaring)
يُسمح بإعادة إعلان متغير JavaScript باستخدام var في أي مكان في البرنامج:
مثال:
var x = 2;
// Now x is 2
var x = 3;
// Now x is 3
مع let، لا يُسمح بإعادة إعلان متغير في نفس الكتلة:
مثال:
var x = 2; // Allowed
let x = 3; // Not allowed
{
let x = 2; // Allowed
let x = 3; // Not allowed
}
{
let x = 2; // Allowed
var x = 3; // Not allowed
}
يُسمح بإعادة إعلان متغير باستخدام let في كتلة أخرى:
مثال:
let x = 2; // Allowed
{
let x = 3; // Allowed
}
{
let x = 4; // Allowed
}
الرفع (Hoisting)
المتغيرات المُعلنة باستخدام var تُرفع إلى الأعلى ويمكن تهيئتها في أي وقت. أي: يمكنك استخدام المتغير قبل إعلانه:
مثال:
carName = "Volvo";
var carName;
المتغيرات المُعلنة باستخدام let تُرفع أيضًا إلى أعلى الكتلة، ولكنها لا تُهّأ. أي: استخدام متغير let قبل إعلانه سيؤدي إلى خطأ مرجعي (ReferenceError):
مثال:
carName = "Saab";
let carName = "Volvo";




