دليل شامل لوظائف السهم و this في جافا سكريبت

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

إن إتقان هذين المفهومين ليس مجرد مسألة نظرية، بل هو مفتاح الكتابة. كتابة أكواد حديثة بلغة جافا سكريبت ورياكتفهم كيفية عمل معالجات الأحداث، وكيف يتصرف السياق داخل الفئات، وكيف يتم حل عمليات الاستدعاء غير المتزامنة في Node.js، ولماذا تعتبر أنماط معينة ممارسات جيدة اليوم.

أولاً وقبل كل شيء: مراجعة سريعة للوظائف في جافا سكريبت

في لغة جافا سكريبت، يمكنك تعريف الدوال بعدة طرق، ولكل طريقة آثار على كيفية عملها. ، وفي نطاق وفي الوقت الحالي، هذه الوظيفة متاحة في الكود.

تعريف الدالة

يستخدم تعريف الدالة الكلاسيكي الكلمة المفتاحية وظيفة واسم. هذه الأنواع من الوظائف "مرتفعة" (الرفع) في بداية النطاق الذي يتم فيه الإعلان عنها، مما يسمح باستدعاء الدالة حتى قبل تعريفها في الملف.

في دالة مُعلنة بطريقة تقليدية، تكون قيمة يتم تحديده وفقًا لـ كيف يتم استدعاء الدالة: إذا تم استدعاؤها كطريقة لكائن، أو إذا تم استخدامها مع جديد، إذا كان في الوضع الصارم، إذا تحول إلى دعوة, تطبيق o ربطإلخ. هذه المرونة قوية، لكنها أيضاً مصدر للعديد من الأخطاء في التعليمات البرمجية المعقدة.

تعبير الدالة

يمكنك أيضًا تعيين دور مجهول أو دور مُسمى لـ متغيرفي هذه الحالة، لا يتم استدعاء الدالة نفسها، بل يتم استدعاء تعريف المتغير فقط (مع فار)، ولكن ليس قيمتها. مع اسمحوا y CONST لا يمكنك حتى استخدامه قبل سطر تعريفه بسبب المنطقة الميتة الصدغية.

تشترك هذه الوظائف في نفس نموذج هذه الديناميكية بخلاف التصريحات الكلاسيكية: تعتمد قيمتها دائمًا على سياق الاستدعاء، لذا فهي تظل حساسة لكيفية تمريرها كدالة رد نداء أو كيفية استخدامها داخل الفئات والكائنات.

ما هي الدوال السهمية تحديداً؟

تم تقديم دوال السهم مع ECMAScript 2015 (ES6) باعتبارها طريقة أكثر ملاءمة وإيجازًا وتعبيرًا لتعريف الدوال، وخاصةً بالنسبة لوظائف الاستدعاء والبرمجة الوظيفية باستخدام أساليب مثل رسم خريطة, تصفية o تخفيض.

يتكون تركيبها الأساسي من قائمة من المعاملات، متبوعة بالمعامل => ثم واحد التعبير أو كتلة الكودهذا التنسيق المضغوط يجعل الكود أكثر كفاءة. مقروء في العديد من السيناريوهات التي كان عليك فيها سابقًا كتابة وظائف مجهولة طويلة ومتكررة.

الصيغة الأساسية لدوال السهم

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

• بدون معلماتتُستخدم الأقواس الفارغة قبل السهم وعادةً ما يُستخدم تعبير بعده.
  const getMessage = () => "Hola";
• معلمة واحدةيمكنك حذف الأقواس المحيطة باسم المعلمة، مما يجعل الكود أكثر إيجازًا.
  const square = x => x * x;
• عدة معاييريجب عليك دائمًا استخدام الأقواس التي تحيط بها، مفصولة بفواصل.
  const sum = (a, b) => a + b;
• نص تعبير واحدإذا لم تستخدم الأقواس المعقوفة، فسيتم إرجاع التعبير بطريقة معينة. ضمني دون الحاجة إلى الكتابة عائد أعلى.
• جسم متعدد الخطوطإذا كنت تستخدم المفاتيح، فعليك الكتابة عائد أعلى بشكل صريح لإرجاع قيمة، تمامًا كما هو الحال في الدالة العادية.

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

الدوال السهمية والكائنات الحرفية

إذا أعادت دالة السهم ذات التعبير الواحد قيمة كائن حرفييجب وضع هذا الكائن بين قوسين حتى لا يخطئ المحرك في اعتباره بداية كتلة الدالة. إنه خطأ برمجي بسيط يوقع الكثيرين في فخّه.

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

دوال الأسهم وسلوكها

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

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

كيف يعمل هذا في الدوال العادية؟

في دالة تم تعريفها باستخدام وظيفة، قيمة الأمر يعتمد على السياق:

• إذا قمت باستدعاء الدالة كـ طريقة الكائن, أشر إلى ذلك الشيء.
• إذا قمت باستدعائه بدون سياق في الوضع غير الصارم، إشارة إلى كائن عام (نافذة في المتصفح، عامة في Node.js).
• إذا كنت تستخدم جديد, ثم يشير إلى مثيل تم إنشاؤه حديثًا.
• إذا قمت بالتقديم دعوة, تطبيق o ربطيمكنك فرض قيمة قم بتوصيله يدويًا بالشيء الذي تختاره.

في الوضع الصارم، إذا قمت باستدعاء دالة عادية بدون كائن كمستقبل وبدون استخدام دعوة أو مشابه، سوف غير محددلهذا السبب ترى في العديد من الأمثلة الحديثة دوالًا تبدأ بـ 'use strict' لتجنب الأخطاء الصامتة وفرض سلوك أكثر اتساقًا.

كيف يعمل هذا في الدوال السهمية؟

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

وهذا له عدة عواقب بالغة الأهمية على حياتك اليومية:

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

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

الدوال السهمية، والفئات، وReact

في عالم رد فعل وبالنسبة لفئات جافا سكريبت بشكل عام، فإن التعامل معها إنها مسألة حساسة. مكونات الفئة الموروثة من مكون React يستخدمون أساليب من خلالها يجب أن يشير باستمرار إلى مثيل المكون من أجل الوصول this.props y هذه الحالة.

باستخدام الطرق المُعرَّفة باستخدام صيغة الفئة الكلاسيكية، فإن قيمة قد "يُفقد" عند تمرير دالة كدالة رد نداء لحدث، على سبيل المثال إلى عند _ النقرلهذا السبب سترى في العديد من الدروس التعليمية القديمة أنماطًا مثل this.metodo.bind(this) في الدالة البانية أو مباشرة في JSX، وهو أمر يعتبر مطولاً للغاية في الوقت الحاضر.

أنماط الربط النموذجية في React

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

• استخدم ربط في الطريقة محصول، مما يضمن السياق ولكنه ينشئ وظيفة جديدة في كل عملية عرض.
• اعمل ال الربط في المُنشئ لتجنب إعادة إنشاء الوظيفة مرارًا وتكرارًا، يتم الحفاظ على مرجع واحد.
• عرّف المعالج على النحو التالي خاصية فئة مع دالة سهمية، مستفيدًا من حقيقة أن دوال الأسهم تلتقط من المثال.
• استخدم دالة السهم مضمنة في JSX، تمرير دالة السهم مباشرة إلى السمة عند _ النقر أو ما يعادلها.

عمليًا، خيار تعريف المعالج كـ خاصية الفئة باستخدام دالة السهم أصبح هذا النمط هو الأنسب: تكتب كودًا أقل، وتتجنب الاضطرار إلى القيام بـ ربط دليل المستخدم و احرص دائمًا على اختيار المكون الخالي من المفاجآت.

دوال السهم في مكونات الدوال

مع وصول المكونات الوظيفية والخطافاتيعتمد React بشكل كبير على الدوال السهمية. معظم المكونات الحديثة مُنفذة باستخدام الدوال السهمية. const MyComponent = () => { … }وهذا يجعل استخدام وظائف الأسهم طبيعيًا ومتسقًا في جميع أنحاء الشجرة.

من الشائع ضمن هذه المكونات دمج وظائف الأسهم مع ميزات ES6 الأخرى مثل تدمير, قالب الحرف, المؤثرات الثلاثية, انتشار وطرق المصفوفات مثل رسم خريطة, تصفية y تخفيضوبالتالي بناء بنية نحوية معبرة للغاية ولكنها تتطلب معالجة جيدة للسياق وعدم قابلية التغيير.

هذا في السياق العالمي، والأشياء والوظائف الفردية

لفهم سبب تغيير الدوال السهمية للعبة بشكل كبير، يجدر بنا مراجعة كيفية عملها. في سياقات جافا سكريبت الأصلية المختلفة، سواء في المتصفح أو في Node.js.

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

هذا داخل الكائنات الحرفية

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

تظهر المشكلة عند استبدال هذه الطرق بـ دوال الأسهمبما أننا لا نملك هذا خاصستلتقط دالة السهم المتغير الخارجي `this`، والذي يُرجح أن يكون المتغير العام أو الخاص بالوحدة. ونتيجةً لذلك، لن تتمكن من الوصول إلى خصائص الكائن داخل الدالة باستخدام مما يخالف تماماً الغرض الأصلي للتصميم.

هذا ضمن الوظائف المرنة والوضع الصارم

في الدوال التقليدية المسماة "غير المتصلة"، بدون كائن استقبال، تكون قيمة يعتمد ذلك على ما إذا كان الكود موجودًا في الوضع الصارم أو ربما لا. من الناحية الدقيقة، يعود الأمر إلى... كائن عامبينما يصبح الأمر، من الناحية الدقيقة، صريحاً غير محددلتجنب القيام بأعمال خطيرة على البيئة العالمية.

يتغير هذا السلوك بشكل جذري عند تغليف التعليمات البرمجية الخاصة بك في وحدات ES أو أدوات التجميع الحديثة أو الدوال المُنفذة فورًا (IIFEs)، حيث يمكن أن يكون المتغير العام مختلفًا أو غير مرتبط بـ بالطريقة المعتادة، وخاصة في Node.js ، حيث يكون النطاق الرئيسي للأرشيف هو نطاق الوحدة النمطية وليس العالمي.

الاتصال، والتقديم، والربط، وعلاقتهم بهذا

توفر لغة جافا سكريبت ثلاث طرق شائعة الاستخدام لإدارة السياق بدلاً من الدوال الكلاسيكية: دعوة, تطبيق y ربطجميعها تتيح لك التحكم بشكل صريح في القيمة التي تتطلبها. عند تنفيذ الدالة.

لا تعمل هذه الطرق إلا مع الدوال المعلنة باستخدام الدالة (أو ما يعادلها)، لأن دوال الأسهم تتجاهل أي محاولة لتغيير قيمة `this` الخاصة بها. ولهذا السبب، تُعدّ الدوال الثلاث مفيدة للغاية عند العمل مع واجهات برمجة التطبيقات القديمة، أو الفئات القديمة، أو الأنماط التي ترغب فيها بإعادة استخدام الدالة نفسها على كائنات مختلفة.

استدعاء وتطبيق: استدعاء باستخدام this صريح

هكذا دعوة كما تطبيق يقومون بتنفيذ الوظيفة على الفورالفرق الوحيد هو كيفية تمرير الوسائط. في كلتا الحالتين، يكون المعامل الأول الذي تمرره هو الكائن الذي يجب تحويله. ضمن الوظيفة.

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

ربط: إنشاء دالة جديدة مرتبطة بـ `this`

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

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

لماذا تُعتبر الدوال السهمية مثالية لعمليات الاستدعاء؟

أحد أسباب سيطرة الدوال السهمية على بيئة جافا سكريبت هو ملاءمتها لـ ردود الاتصال غير المتزامنة والبرمجة الوظيفية. عند العمل مع واجهات برمجة التطبيقات مثل setTimeout, مجموعة الفاصل الزمني, وعود أو مع حلقة أحداث Node.js، غالبًا ما تحتاج إلى الوصول إلى السياق الخارجي دون أن يتعرض للتشويه.

قبل ES6، كانت تُستخدم حيل مثل الحفظ const self = this o const that = this قبل الدخول إلى دالة الاستدعاء، حتى يظل من الممكن الإشارة إلى الكائن الصحيح من داخل الدالة. تجعل دوال السهم هذا الأمر غير ضروري من خلال التقاط الكائن تلقائيًا. هذا خارجي والحفاظ عليه.

الدوال السهمية وحلقة الأحداث في Node.js

En Node.js حيث تدور معظم التعليمات البرمجية المثيرة للاهتمام حول الإدخال/الإخراج غير المتزامن (الملفات، الشبكة، المؤقتات)، دمج الدوال السهمية مع نموذج حلقة الأحداث وقوائم انتظار الاستدعاء إنه يُبسط الحياة كثيرًا. في كل مرة تُمرر فيها دالة مثل مُعرّف إلى fs.readFileسواء كنت ترسل خادم HTTP أو أي عملية libuv، فإن وظائف الأسهم تساعد في الحفاظ على المراجع للمتغيرات المتجاورة وسياقات الوحدات النمطية خالية من المفاجآت.

علاوة على ذلك، في قوائم انتظار المهام الصغيرة مثل تلك الخاصة بـ وعود o process.nextTickمن الشائع جدًا كتابة دوال رد نداء قصيرة مثل then o قبض باستخدام صيغة السهم، مع الاستفادة من كليهما إرجاع ضمني كما هذا المعجممما يجعل الكود أكثر وضوحًا وتعبيرًا.

متى يجب عليك عدم استخدام الدوال السهمية؟

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

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

تجنب استخدام الدوال السهمية كطرق للكائنات.

إذا قمت بتعريف دالة سهمية لكائن ما، فإن لن يشير هذا الداخلي إلى الكائنبل يتعلق الأمر بالسياق الذي تم فيه تعريف هذا الكائن. وهذا يخالف توقعات أي شخص يقرأ الكود وينوي استخدامه هذه الخاصية ضمن المنهجية.

الطريقة المُوصى بها لكتابة الدوال التي تعتمد على يتعلق الأمر بالاستمرار في استخدام الصيغة الكلاسيكية في الكائنات الحرفية أو تعريف تلك الطرق بطريقة قياسية في الفئات، مع حجز دوال السهم لعمليات الاستدعاء الداخلية التي تحتاج إلى التقاط من خلال أسلوب متفوق.

لا تستخدم الدوال السهمية كدوال بانية

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

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

العلاقة مع الميزات الحديثة الأخرى للغة جافا سكريبت

نادراً ما تُستخدم دوال الأسهم بشكل منفرد؛ فهي دائماً ما تُستخدم جنباً إلى جنب مع ميزات أخرى لـ ECMAScript الحديثة وهذا يؤثر أيضاً على كيفية تنظيمك وفهمك للتعليمات البرمجية. ومن أكثرها ارتباطاً ما يلي: اسمحوا y CONST، ثبات، و تدمير و بناء الجملة المنتشر.

إن معرفة كيفية دمجها بشكل صحيح تتيح لك كتابة دوال سهمية موجزة للغاية تقوم بتحويل البيانات باستخدام طرق المصفوفات مثل رسم خريطة, تصفية y تخفيضالحفاظ دائمًا على الحالة الأصلية سليمة، وهو أمر بالغ الأهمية في بيئات مثل React حيث يكون نمط عدم قابلية التغيير هو القاعدة.

let، const، وعدم قابلية التغيير

وصول اسمحوا y CONST أتاح ذلك العمل مع نطاقات الكتل ومع المراجع التي لا يُعاد تعيينها. وبالاقتران مع دوال الأسهم، أصبح من الممارسات الشائعة اليوم تعريف الدوال على النحو التالي: const myFunction = () => {…}، مما يضمن عدم استبدال المتغير الذي يحتوي على الدالة.

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

القيم الحرفية للقوالب، والمعاملات الثلاثية، والدائرة المختصرة

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

ضمن القوالب الحرفية، التعبيرات ${…} يتم حلها بنفس النطاق المعجمي الذي يهيمن على "this" في دوال السهم، لذلك من الضروري أن تكون واضحًا بشأن المتغيرات والسياق المستخدم في كل عملية استيفاء لتجنب السلوك الغامض.

الدوال السهمية في التكرارات والمجموعات

أحد المجالات التي أحدثت فيها دوال الأسهم فرقًا كبيرًا هو معالجة المصفوفات والمجموعاتتمرير ردود استدعاء قصيرة إلى طرق مثل رسم خريطة, تصفية, جد o تخفيض يصبح النص أكثر قابلية للقراءة بشكل كبير باستخدام صيغة السهم.

على سبيل المثال، يصبح تصفية الإدخالات في قائمة بناءً على فئة أو تحويل نتائج واجهة برمجة التطبيقات إلى هياكل بيانات داخلية أكثر وضوحًا، بالإضافة إلى تدمير من السهل استخراج الخصائص التي تحتاجها فقط من داخل معلمات الدالة.

رسم الخرائط، والتصفية، والاختزال، والشركة

عادةً ما يكون التركيب النموذجي على النحو التالي: list.filter(item => condition).map(item => transformation)ربط عدة دوال سهمية في دوال مصفوفة. كل منها يرث `this` من السياق الذي تم تعريفها فيه، على الرغم من أنه في معظم هذه الحالات لا يتم استخدام `this`، بل يتم استخدام معلمات صريحة، مما يعزز الأسلوب الوظيفي.

En تخفيضفي هذه الحالة، حيث تدير مُجمِّعًا ينتقل من تكرار إلى آخر، تسمح لك دوال السهم بالتعبير عن عملية الاختزال بإيجاز شديد، على الرغم من أنه من المستحسن عدم الإفراط في استخدام التعبيرات الكثيفة للغاية إذا كنت تريد أن يظل الكود مفهومًا للمطورين الآخرين.

الواردات والصادرات والوحدات النمطية

في بيئة جافا سكريبت الحديثة، يتم تنظيم جميع التعليمات البرمجية تقريبًا في وحداتإما باستخدام بناء الجملة الأصلي استيراد و تصدير أو باستخدام أنظمة تجميع تُترجم إلى هذا التنسيق. في هذا السياق، تُعدّ دوال الأسهم مناسبة جدًا كوحدات وظيفية قابلة لإعادة الاستخدام.

من الشائع رؤية المرافق يتم تصديرها على أنها const myUtil = (…) => {…} ثم يتم استيرادها إلى ملفات مختلفة. وبما أن كل وحدة نمطية تقع ضمن نطاقها الخاص، فإن هذا المعجم يميل سياق الدوال السهمية إلى أن يكون سياق الوحدة النمطية، وهو أمر غير ذي صلة في معظم الأدوات المساعدة البحتة، لأنها لا تحتاج إلى سياق.

أفضل الممارسات مع الوحدات والبرامج النصية الخارجية

عند عرض جافا سكريبت في صفحة HTML، يُفضل تحميلها باستخدام الملفات الخارجية وتجنب تضمين كتل برمجية كبيرة مضمنة. واستخدم السمة أيضًا. type="module" يُمكّن الوسم script من استخدام بناء الجملة الحديث استيراد و تصدير ويوضح أن الملف يتم تنفيذه في الوضع صارم إفتراضي.

فيما يتعلق بالأداء، فإن وضع نصوص الوحدة في رئيس مع تأجيل يسمح للمتصفح بتنزيل التعليمات البرمجية وتنفيذها دون حجب عملية العرض في لغة HTML، مع الحفاظ على تجربة مستخدم جيدة. في هذا المخطط برمته، تُعدّ دوال الأسهم ببساطة الطريقة الأمثل لتعريف أجزاء صغيرة من المنطق القابل لإعادة الاستخدام.

إدراج ومعالجة DOM باستخدام جافا سكريبت الحديثة

على الرغم من أن محور هذا الموضوع ينصب على دوال السهم و`this`، إلا أنه من المستحيل تجاهل دور جافا سكريبت في التلاعب بـ DOMأساليب مثل getElementById, querySelector, تعيين السمة أو تعديل نمط لا تزال هذه الأدوات أساسية، ولكنها اليوم عادة ما يتم دمجها مع ردود الاتصال السهمية للتفاعل مع الأحداث وتحديث الواجهة.

العمل مع مستمعي الحدث باستخدام element.addEventListener('click', e => {...}) هذه هي الطريقة القياسية لربط المنطق بتفاعلات المستخدم. في هذه المعالجات، داخل دالة السهم، لن يكون عنصر DOM، بل السياق الخارجي، لذلك إذا كنت بحاجة إلى العقدة، فسيتعين عليك استخدام معلمة الحدث نفسها. e.currentTarget o الهدف الإلكتروني، بدلاً من الاعتماد على هذا كما هو الحال مع السمات المضمنة القديمة.

جافا سكريبت المتزامنة، جافا سكريبت غير المتزامنة، وردود الاتصال

مجال رئيسي آخر تُحدث فيه دوال الأسهم فرقًا هو في البرمجة غير المتزامنةلغة جافا سكريبت أحادية الخيوط، ولتجنب حظر الواجهة، فإنها تفوض العمليات البطيئة إلى المتصفح أو واجهات برمجة تطبيقات Node التي تستدعي بعد ذلك ردود الاتصال الخاصة بك عند الانتهاء.

مرر دوال السهم كدوال رد نداء إلى setTimeout, وعودتُساهم طلبات HTTP أو عمليات الوصول إلى القرص في جعل الكود أكثر اختصارًا والحفاظ على السياق دون الحاجة إلى حيل إضافية. في خطوة الاستدعاءات المتداخلة نحو وعود وفي وقت لاحق نحو غير متزامن/انتظارلقد كانت الدوال السهمية عنصراً أساسياً في جعل تدفق البيانات قابلاً للقراءة.

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