وظائف جافا سكريبت

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

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

تعبيرات الوظيفة

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

ضع هذا الإعلان في تعبير JavaScript (مثل في مهمة أو تعبير حسابي) ، يصبح أ وظيفة التعبير.

// دالة التصريح الدالة function_name () ؛ // Function تعبير var function_name = function () ؛ 

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

function_name ()؛ // function call [WORKS] function function_name () ؛ 

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

function_name ()؛ // function call [WON'T WORK] var function_name = function () ؛ 

استدعاء دالة فورًا التعبير (IIFE)

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

فيما يلي بناء الجملة الأكثر شيوعًا لإنشاء IIFE:

(وظيفة اختياري_الوظيفة () // body ()) ؛ 

و

(function اختياري_function_name () // body) ()؛ 

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

// بعض الطرق لإنشاء IIFEs! function () / * ... * / ()؛ + وظيفة () / * ... * / () ؛ وظيفة جديدة () / * ... * / ؛ 

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

var page_language = (function () var lang؛ // Code للحصول على لغة الصفحة lang؛) ()؛ 

يتم تنفيذ التعليمات البرمجية للحصول على لغة الصفحة مرة واحدة فقط (ويفضل بعد تحميل الصفحة). يتم تخزين النتيجة في page_language لاستخدامها لاحقا.

أساليب

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

var calc = add: function (a، b) return a + b، sub: function (a، b) return a-b console.log (calc.add (1،2))؛ // 3 console.log (calc.sub (80،2))؛ // 78 

ال إضافة و الفرعية وظائف هي طرق احسب موضوع.

الآن للحصول على وظيفة ضمن مثال الدالة:

وظيفة add (a) return function (b) return a + b؛ console.log (add (1) (2))؛ // الناتج هو 3 

دالة مجهولة المصدر هي طريقة وظيفة إضافة.

ملاحظة: منذ المعلمة (ا) وظيفة إضافة في المثال أعلاه متاح لاستدعاء الوظيفة التالية ، ويسمى هذا النوع من العمليات الضمادة.

الصانعين

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

وظيفة Fruit () var name، family؛ // الاسم العلمي والعائلة this.getName = function () return name؛؛ this.setName = function (value) name = value؛ this.getFamily = function () return family؛؛ this.setFamily = function (value) family = value؛ فار آبل = فاكهة جديدة () ؛ apple.setName ("Malus domestica") ؛ apple.setFamily ( "ورديات")؛ فار برتقالي = فاكهة جديدة () ؛ orange.setName ("Citrus à ؟؟  ؟؟ â  ؟؟ ؟؟ sinensis ")؛ orange.setFamily (" Rutaceae ")؛ console.log (orange.getName ())؛ //" Citrus à ؟؟  ؟؟ â  ؟؟ ؟؟ sinensis "console.log (apple.getName ()) ؛ //" Malus domestica "console.log (orange.getFamily ())؛ //" Rutaceae " 

وظائف السهم (ES6 قياسي) [فقط في Firefox]

يوفر تعريف الوظيفة الجديد من ES6 Standard بناء جملة أقصر للتعبير عن الوظيفة. بناء الجملة هو

() => / * body * / 

هذه العينة وظيفة:

var sing = function () console.log ('singing ...')؛ 

بالضبط مثل:

var sing = () => console.log ('singing ...')؛ 

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

فهي مفيدة عندما تريد هذه داخل وظيفة لتكون هي نفسها خارجها وصياغتها أقصر يجعل رمز للكتابة وظيفة داخل وظيفة موجزة (مثل أدناه)

setInterval (function () console.log ('message') ، 1000) ؛ 

إلى

setInterval (() => console.log ('message') ، 1000) ؛ 

وظائف المولدات (ES6 قياسي) [فقط في Firefox]

تعريف وظيفة جديدة من ES6 قياسي هو وظيفة مولد. وظائف المولد قادرة على وقف واستمرار تنفيذها. بناء الجملة هو:

الدالة * function_name ()  

أو

الدالة * function_name ()  

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

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

أدناه مثال بسيط:

function * generator_func (count) for (var i = 0؛ i 
إليك مثال آخر:
 
دالة * randomIncrement (i) yield i + 3؛ العائد i + 5 ؛ العائد i + 10 ؛ العائد i + 6؛  var itr = randomIncrement (4)؛ console.log (. itr.next () قيمة)؛ // 7 console.log (itr.next (). value)؛ // 9 console.log (itr.next (). value)؛ // 14 
 
هناك أيضا يخضع أو يستسلم* التعبير الذي يمرر القيمة إلى وظيفة مولد أخرى
 
وظيفة * الفواكه (الفاكهة) العائد * الخضار (الفاكهة) ؛ العائد "العنب".  وظيفة * الخضار (الفاكهة) العائد الفاكهة + "والسبانخ" ؛ إنتاج الفاكهة + "والبروكلي" ؛ إنتاج الفاكهة + "والخيار" ؛  var itr = ثمار ("Apple") ؛ console.log (. itr.next () قيمة)؛ // "Apple and Spinach" console.log (itr.next (). value)؛ // "Apple and Broccoli" console.log (itr.next (). value)؛ // "Apple and Cucumber" console.log (itr.next (). value)؛ // "Grapes" console.log (itr.next (). value)؛ //غير محدد 
 
تكون وظائف المولد مفيدة إذا كنت تريد الانتقال عبر القيم واحدًا تلو الآخر عند النقطة المفضلة في الشفرة عن طريق الإيقاف المؤقت لها ، بدلاً من واحدة تلو الأخرى في التكرار خلال صفيف.
 
استنتاج
 
لقد أدرجت قائمة من المراجع أدناه ، حيث ستجد روابط للمراجع والمقالات التي تتعمق في مواضيع مختلفة بشكل منفصل. كلتا الدالتين المعياريتين ES6 ستعملان فقط في Firefox في الوقت الحالي.
 
المراجع
 
لغة ECMAScript: وظائف وفئات
 
تعبير الوظيفة المستدعى فورًا (IIFE)
 
أساسيات ES6 مولدات
 
وظائف السهم
 
وظيفة - موزيلا المطور الشبكة