جافا سكريبت وظائف السهم يمكن أن تجعلك أفضل مطور

الإعلانات

جلبت JavaScript ES6 تغييرات مثيرة في عالم تطوير الويب. جلبت الإضافات الجديدة إلى لغة JavaScript إمكانيات جديدة.

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

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

ما هي وظائف سهم JavaScript؟

وظائف السهم هي طريقة جديدة لكتابة تعبيرات الوظيفة التي كانت المدرجة في الافراج عن جافا سكريبت ES6 ما هو ES6 وما يحتاج مبرمجو Javascript إلى معرفتهيشير ES6 إلى الإصدار 6 من لغة برمجة ECMA Script (Javascript). دعونا الآن نلقي نظرة على بعض التغييرات الرئيسية التي يجلبها ES6 إلى JavaScript. اقرأ أكثر . تشبه تعبيرات وظيفة JavaScript التي تستخدمها ، مع بعض القواعد المختلفة قليلاً.

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

تستخدم هذه الوظائف رمزًا جديدًا للسهم:

=>

إذا كنت قد عملت في Python على الإطلاق ، فهذه الوظائف تشبهها كثيرًا

تعبيرات بايثون لامدا دليل المبتدئين لفهم وظائف بايثون لامداتعد Lambdas في Python واحدة من أكثر الميزات المفيدة والهامة والمثيرة للاهتمام التي يجب معرفتها. إليك كيفية استخدامها ولماذا تكون مفيدة. اقرأ أكثر .

بناء جملة هذه الوظائف أنظف قليلاً من الوظائف العادية. هناك بعض القواعد الجديدة التي يجب وضعها في الاعتبار:

• تتم إزالة وظيفة الكلمة الأساسية
• عودة الكلمة هو اختياري
• الأقواس المتعرجة اختيارية

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

كيفية استخدام وظائف السهم

وظائف السهم هي سهلة الاستخدام. فهم وظائف السهم أسهل عند المقارنة مع تعبيرات الوظائف التقليدية.

فيما يلي تعبير دالة يضيف رقمين ؛ أولاً باستخدام طريقة الوظيفة التقليدية:

 واسمحوا addnum = function (num1، num2) {return num1 + num2؛ }; الملحق (1،2) ؛ >>3

إنها وظيفة بسيطة جدًا وتتطلب وسيطين وتُرجع المجموع.

هنا هو تغيير التعبير إلى وظيفة السهم:

واسمحوا addnum = (num1، num2) => {return num1 + num2؛}؛ الملحق (1،2) ؛ >>3

بناء جملة الوظيفة مختلف تمامًا باستخدام دالة السهم. تتم إزالة وظيفة الكلمة الرئيسية ؛ يتيح رمز السهم للجافا سكريبت معرفة أنك تكتب وظيفة.

الأقواس المتعرجة والكلمة الرئيسية للعودة لا تزال هناك. هذه اختيارية مع وظائف السهم. إليك مثال أبسط لنفس الوظيفة:

واسمحوا addnum = (num1، num2) => num1 + num2؛

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

هناك المزيد من المهام للسهم. دعنا نغطس بشكل أعمق حتى تشعر بشكل أفضل عما يمكنهم القيام به.

ميزات وظيفة السهم

وظائف السهم لها العديد من الاستخدامات والميزات المختلفة.

وظائف منتظمة

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

اسمحوا مربع = س => س * س مربع (2) ؛ >>4

يمكن استخدام وظائف السهم بدون وسيطات. إذا كنت لا تستخدم أي وسيطات في وظيفتك ، فيجب عليك استخدام قوس فارغ.

واسمحوا helloFunction = () => Console.log ("مرحبًا القارئ!") ؛ helloFunction ()؛ مرحبا القارئ!

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

باستخدام هذا

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

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

إليك مثال شائع يوضح الحل البديل الذي يجب عليك استخدامه مع الوظائف العادية.

وظيفة الشخص () {var that = this؛ // عليك تعيين "هذا" لمتغير جديد that.age = 0 ؛ setInterval (دالة growUp () {that.age ++؛ }, 1000); }

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

Function Person () {this.age = 0؛ setInterval (() => {this.age ++؛ // الآن يمكنك استخدام "هذا" بدون إعلان متغير جديد} ، 1000) ؛ }

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

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

دع البيتزا = { الطبقة: 5 ، removeToppings: () => {this.toppings--؛ } } / / كائن البيتزا مع 5 الطبقة. > البيتزا. >> {الطبقة: 5 ، removeToppings: f} pizza.removeToppings () ؛ / / الطريقة لن تفعل أي شيء للكائن> البيتزا. >> {الطبقة: 5 ، removeToppings: f} // لا يزال لديه 5 عناصر.

العمل مع المصفوفات

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

هناك بعض الطرق المفيدة مثل خريطة الطريقة التي تعمل على وظيفة جميع عناصر مجموعة وإرجاع مجموعة جديدة.

دع myArray = [1،2،3،4]؛ myArray.map (دالة (عنصر) { عنصر العودة + 1 ؛ }); >> [2,3,4,5]

هذه هي وظيفة بسيطة جدا تضيف واحدة إلى كل قيمة في الصفيف. يمكنك كتابة نفس الوظيفة برمز أقل باستخدام وظيفة السهم.

دع myArray = [1،2،3،4]؛ myArray.map (element => { عنصر العودة + 1 ؛ }); >> [2,3,4,5]

من الأسهل قراءة الآن.

إنشاء كائن الحرفي

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

واسمحوا createObject = function createName (الأول ، الأخير) {return {أولاً: أولاً ، والأخير: الأخير} ؛ };

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

دع createArrowObject = (الأول ، الأخير) => ({الأول: الأول ، الأخير: الأخير}) ؛

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

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

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

هل تريد معرفة المزيد عن جافا سكريبت؟ لنا ورقة الغش جافا سكريبت في نهاية المطاف جافا سكريبت الغش ورقةاحصل على تجديد سريع لعناصر JavaScript باستخدام ورقة الغش هذه. اقرأ أكثر يوفر معلومات قيمة ومعرفة المزيد عنها كيف يعمل جافا سكريبت ما هي جافا سكريبت وكيف تعمل؟إذا كنت تتعلم تطوير الويب ، فإليك ما تحتاج إلى معرفته عن JavaScript وكيفية عملها مع HTML و CSS. اقرأ أكثر يمكن أن تجعلك مطور أفضل.