وجهات النظر سياق جافا سكريبت

مرحبا مرة أخرى! لقد كتبنا بالفعل أنه في نهاية سبتمبر في OTUS ، سيتم بدء تدفق جديد من الدورة التدريبية "Fullstack JavaScript Developer" . تحسبا لبداية الفصول الدراسية ، نستمر في مشاركة مقالات حقوق التأليف والنشر التي أعدت خصيصًا لطلاب الدورة. اليوم سننظر في أنواع السياق في جافا سكريبت. دعنا نذهب.

مؤلف المقال: بافل ياكوبوف




الغرض من هذه المقالة هو أن يفهم القارئ المفاهيم الأساسية للنطاقات المستخدمة في JavaScript.

يعد Scope أحد أهم الأشياء في JavaScript (وله مكان في معظم لغات البرمجة الحديثة). يرتبط النطاق بالحياة الطويلة للمتغير أو الوظيفة ، والوصول ، ورؤية المتغيرات ، وبعض الأشياء الأخرى.

لماذا نحتاج هذا النطاق؟


ينفذ النطاق في لغات البرمجة الوظائف التالية:
الأمان (التغليف) - المتغيرات والوظائف متوفرة فقط عند الحاجة.
يزيل تعارض الأسماء المتغيرة. يسمح لك وجود النطاقات بعدم "تفريغ" جميع المتغيرات في كومة واحدة ، ومحاكاة مساحات الأسماء (مساحة الاسم).
إعادة استخدام الشفرة - يمكن عندئذٍ استخدام الشفرة المكتوبة ، مع تجنب التأثيرات "الغريبة".

أنواع النطاقات


في أبسط المستويات ، يوجد في JavaScript نطاقان - محلي وعالمي.

في هذه المقالة ، سنتطرق أيضًا إلى نطاق مثل المعجم والكتل.

النطاق العالمي


عند فتح مستند في JavaScript وبدء كتابة التعليمات البرمجية ، فإنك تدخل في النطاق العام.

كل ما يتم إنشاؤه في النطاق العالمي - المتغيرات والوظائف - يمكن الوصول إليه من أي مكان في البرنامج. أيضًا ، تتوفر المتغيرات العامة طوال الوقت الذي يتم فيه تشغيل التطبيق الخاص بك ولا يتم حذفه إلا عند انتهاء البرنامج من عمله.

يستخدم الكثير من القادمين الجدد في البداية المتغيرات العالمية كثيرًا - وهذا أمر سهل إلى حد ما في البرمجة ، لكن هذا يعتبر ممارسة سيئة ، وغالبًا ما يؤدي إلى برامج غير مستقرة تستخدم في نهاية المطاف ذاكرة أكثر بكثير مما يحتاجون إليه بالفعل. بعد كل شيء ، إذا تم تغليف المتغيرات بشكل موثوق داخل الوظائف التي يتم استخدامها ، في نهاية هذه الوظيفة ، سيتم حذفها من الذاكرة باستخدام أداة تجميع مجمعي البيانات المهملة والتوقف عن شغل ذاكرة العميل ، والتي ليست لانهائية.

النطاق المحلي


المتغيرات التي تم الإعلان عنها محليًا متوفرة فقط في النطاق الذي تم إعلانها فيه.

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

function foo(){ let x = 15; } //console.log(x); error { let y = 14; } // console.log(y);  error { var z = 13; } console.log(z); // var   , //        // -  13 

نطاق المعجمية


فما هو نطاق المعجمية؟ بعبارات بسيطة ، هذه هي قدرة الوظيفة الداخلية على الوصول إلى نطاق خارجي. هنا تجدر الإشارة إلى ممارسة الإغلاق. ربما يمكنك كتابة مقالتين أخريين عنهم ، لكنني سأعطيك مثالًا كلاسيكيًا سريعًا:

 sum(5)(5) //    ? function sum(a){ var add = function(b){ return a+b; } return add; } console.log(sum(5)(5)); // 10   //      

كتلة النطاق


حتى الآن ، ناقشنا فقط النطاق المرتبط بتشغيل الوظائف والأقواس المعقوفة {} ، وقد ناقشنا الاختلافات في تشغيل var والسماح فقط بشكل غير مباشر.

كيف يعمل التوجيه var؟ عندما يتم التصريح عن متغير باستخدامه في النطاق العام ، يتم تعيين اسم المتغير كخاصية لكائن النافذة العامة (إذا كنا نقصد المتصفح) ويبقى هناك طوال الوقت الذي يعمل فيه البرنامج. في الوقت نفسه ، كنطاق كتلة ، مثل {} (وإذا ، من أجل ، بينما ، ويتم تضمين جميع المجالات الأخرى بشكل منطقي تمامًا).

بالإضافة إلى ذلك ، هناك سمة أخرى من سمات "السماح" و "const" في نفس النطاق ، ثم لا يمكن الإعلان عنها مرة أخرى في نفس النطاق (حسنًا ، يبدو استياء المترجم الشفهي منطقيًا تمامًا هنا).

 let x = 15; console.log(x); //   { let x = 16; //       console.log(x) //          let x = 17; //        ,         } 

وظيفة جديدة


ميزات النطاق عند إعلان وظيفة جديدة باسم "وظيفة جديدة". نادرًا ما يتم استخدام هذا الخيار لإنشاء وظيفة ، ولكن قد يكون مطلوبًا في بعض الأحيان.
مثال بناء الجملة:

 //let newFunc = new Function([arg1, arg2…argN], functionBody); let mult = new Function('a', 'b', 'return a * b'); console.log(mult(3,4)); 

عادةً ما تتذكر الدالة المكان الذي ولدت فيه (Lexical Environment) ، لكن عندما يتم إنشاء دالة باستخدام بنية دالة جديدة ، فإنها لا تكتب متغيرات البيئة المحيطة بها ، كما في الحالة العادية ، ولكن فقط تلك المعلنة عالمياً.

 //   ,      ()()     let a = 3; function outerFunc() { var a = 2; var func = new Function('console.log(a*a)'); return func; } outerFunc()(); // 9,    window 

الرفع (رفع المتغيرات)


مناقشة النطاق ، لم نتمكن من تناول موضوع رفع نطاق المتغيرات. يقوم المترجم الذي يقرأ الكود بقراءته فعليًا مرتين: يقرأ الدالات المعلنة كإعلان دالة ، ويقرأ المتغيرات العامة المعلنة مع المتغير var. ومع ذلك ، يتم تسجيل المتغيرات ليس من خلال قيمها المعلنة ، ولكن حسب القيمة غير محددة.

 console.log(x); // undefined var x = 15; console.log(y);// error let y = 13; 

دع هذا الموضوع لا يرتبط إلا بشكل غير مباشر بمجالات الرؤية ، ولكن في بعض الأحيان قد تكون هذه المعرفة مفيدة.

شكرا لكم جميعا! آمل أن يكون هذا المقال مفيدًا لشخص ما!



روابط مفيدة:

developer.mozilla.org/en-US/docs/Glossary/Scope
developer.mozilla.org/ru/docs/Web/JavaScript/Closures
2ality.com/2015/02/es6-scoping.html
learn.javascript.ru/new-function
habr.com/ru/company/otus/blog/466873

Source: https://habr.com/ru/post/ar467631/


All Articles