يتمثل دور نمط تصميم JavaScript في تحسين قابلية إعادة استخدام الكود وقابلية القراءة ، مما يجعل الكود أسهل في الحفاظ عليه والتوسع.
في JavaScript ، الوظيفة هي فئة من الكائنات ، مما يعني أنه يمكن تمريرها كمعلمة إلى وظائف أخرى ؛ بالإضافة إلى ذلك ، يمكن أن توفر الوظيفة أيضًا نطاقًا.
بناء الجملة لإنشاء وظيفة
تعبيرات الوظيفة المسماة
// name function expression var add = function add (a ، b) {return a+b ؛} ؛ var foo = function bar () {console.log (foo === bar) ؛} ؛ foo () ؛ // trueيمكن ملاحظة أنهم يشيرون إلى نفس الوظيفة ، ولكن هذا صحيح فقط في جسم الوظيفة.
var foo = bar funts
ومع ذلك ، لا يمكنك استدعاء الوظيفة عن طريق استدعاء شريط ().
var foo = (function bar () {console.log (foo === bar) ؛}) () ؛ // falseتعبيرات الوظيفة
// المعروف أيضًا باسم الدالة المجهولة var add = function (a ، b) {return a+b ؛} ؛القيمة المخصصة للمتغير إضافة هي تعريف الوظيفة نفسه. وبهذه الطريقة ، تصبح إضافة وظيفة يمكن استدعاؤها في أي مكان.
إعلان الوظائف
الدالة foo () {// code هنا} // ليست هناك حاجة إلى semicolons هنافي الفوائد الفاصلة ، يجب أن تستخدم تعبيرات الوظائف دائمًا فاصلة فنية ، ولا يلزم نهاية المنقصات في إعلان الوظيفة.
الفرق بين الوظيفة التعريفية والتعبير عن الوظيفة هو أنه خلال فترة التحميل المسبق لـ JS ، سيتم استخراج الوظيفة التعريفية أولاً ، ثم يتم تنفيذ رمز JS بالترتيب:
console.log (f1) ؛ // [الوظيفة: F1]
console.log (f2) ؛ // undefined ، لا يتم تفسير JavaScript وتنفيذها بالكامل بالترتيب ، ولكن سوف "precompile" JavaScript قبل التفسير. أثناء عملية التحميل المسبق ، سيتم تنفيذ الوظيفة النهائية أولاً.
الدالة f1 () {console.log ("i am f1") ؛} var f2 = function () {console.log ("i am f2") ؛} ؛نظرًا لأن إعلان الوظائف سيتم إكماله أثناء بناء النطاق العالمي ، فإن إعلان الوظائف هي خصائص لكائنات النوافذ ، مما يوضح لماذا بغض النظر عن مكان إعلان وظائفه ، حيث تعلن الوظائف في نهاية المطاف إلى كائنات النوافذ.
في لغة JavaScript ، تنتمي أي وظيفة مجهولة إلى كائن نافذة. عند تحديد وظيفة مجهولة ، ستعيد عنوان ذاكرته. إذا تلقى متغير عنوان الذاكرة هذا في هذا الوقت ، فيمكن استخدام الوظيفة المجهولة في البرنامج ، لأن الوظيفة المجهولة يتم تعريفها وتعيينها أيضًا أثناء بناء بيئة التنفيذ العالمي ، لذلك فإن الإشارة إلى الوظيفة المجهولة هي أيضًا كائن نافذة
var f2 = function () {console.log ("i am f2") ؛} ؛ console.log (f2 ()) ؛ // i am f2 (function () {console.log (this === window) ؛ // true}) () ؛تصريحات الوظيفة والتعبيرات
تعزيز الوظائف (الرفع)
سلوك إعلان الوظيفة لا يعادل تعبير الوظيفة المسماة. الفرق هو السلوك الرافعة. انظر المثال التالي:
<script type = "text/javaScript"> // وظيفة الوظيفة العالمية foo () {Alert ("Global Foo!") ؛} bar () {Alert ('global bar') ؛} function hoist () {console.log (typeof foo) ؛ BAR () ؛ // typeerror: "غير محدد" ليس دالة // متغير FOO والمنفذ يتم تعزيز الوظيفة FOO () {Alert ('local foo! ') ؛ } // يتم تعزيز شريط متغير فقط ، لا يتم الترويج لجزء تنفيذ الوظيفة VAR = function () {Alert ('local bar!') ؛ } ؛ } hoist () ؛ </script>بالنسبة لجميع المتغيرات ، أينما تم إعلانها في الجسم ، يتم ترقيتها داخليًا إلى أعلى الوظيفة. سبب التطبيق العام للوظائف هو أن الوظائف هي فقط كائنات مخصصة للمتغيرات.
كما يوحي الاسم ، يعني التحسين ذكر الأشياء التالية إلى الأعلى. في JS ، هو ترقية الأشياء المحددة في ما يلي (المتغيرات أو الوظائف) إلى التعريف السابق. كما يتضح من المثال أعلاه ، ينتقل FOO و BAR في الوظيفة داخل الوظيفة إلى الأعلى ، وبالتالي تغطي وظائف FOO و BAR العالمية. الفرق بين شريط الوظائف المحلية و FOO هو أنه يتم ترقية FOO إلى الأعلى ويمكن أن يعمل بشكل طبيعي ، في حين لم يتم تحسين تعريف BAR () ، يتم الترويج فقط إعلانه. لذلك ، عند تنفيذ BAR () ، تكون النتيجة غير محددة بدلاً من استخدامها كدالة.
وضع وظيفة الوقت الحقيقي
الوظائف هي أيضًا كائنات ، بحيث يمكن استخدامها كقيم إرجاع. تتمثل ميزة استخدام وظائف التنفيذ الذاتي في الإعلان مباشرة عن وظيفة مجهولة واستخدامها على الفور ، وذلك لتجنب تحديد وظيفة لا تستخدم مرة واحدة ، ويتم تجنبها من مشكلة تسمية الصراعات. لا يوجد مفهوم مساحة الاسم في JS ، لذلك من السهل أن يكون هناك تعارضات في اسم الوظيفة. بمجرد إجراء الصراع التسمية ، يسود آخر مرة واحدة.
الوضع 1:
<script> (function () {var a = 1 ؛ return function () {Alert (2) ؛} ؛} () ()) ؛ // 2 pops Up ، فإن الأقواس الأولى تنفذ نفسها ، ويقوم الأقواس الثانية بتنفيذ وظائف مجهولة المصدر </script>النمط 2: الإشارة إلى متغيرات وظيفة التنفيذ الذاتي
<script type = "text/javaScript"> var result = (function () {return 2 ؛}) () ؛ // تنبيه الوظيفة (النتيجة) ؛ // النتيجة إلى قيمة الإرجاع 2 من الدالة الذاتية ؛ إذا ظهرت النتيجة () تنبثق ، سيحدث خطأ </script>النمط الثالث: وظائف متداخلة
<script type = "text/javaScript"> var result = (function () {return function () {return 2 ؛} ؛}) () ؛ ALERT (result ()) ؛ // عندما يكون تنبيه (نتيجة) وظيفة () {return 2} </script>الوضع 4: وظيفة التنفيذ الذاتي تعين قيمة الإرجاع إلى متغير
var abc = (function () {var a = 1 ؛ report function () {return ++ a ؛}}) () ؛ // إرجاع دالة وظيفة التنصت الذاتية الوظيفة بعد العودة إلى التنبيه المتغير (abc ()) ؛ // إذا كانت في حالة تأهب (ABC) ، فإن الكود بعد بيان الإرجاع قد تم تفسيره ؛ إذا كانت ABC () ، فسيتم تنفيذ الوظيفة بعد الإرجاعالنمط 5: تنفذ الوظيفة نفسها داخليًا ومتكررًا
// هذه وظيفة تنفيذ ذاتية ، تنفذ الوظيفة نفسها داخليًا ، الوظيفة العودية ABC () {ABC () ؛ }وضع رد الاتصال
وظيفة رد الاتصال: عندما تمرر دالة الكتابة () كوسيطة إلى دالة أخرى ، يجوز للاتصال () تنفيذ (أو استدعاء) الكتابة () في مرحلة ما. في هذه الحالة ، تسمى الكتابة () وظيفة رد الاتصال.
مستمع حدث غير متزامن
يحتوي وضع رد الاتصال على العديد من الاستخدامات ، على سبيل المثال ، عندما يتم إرفاق مستمع حدث بعنصر على الصفحة ، فإنه يوفر بالفعل مؤشرًا لوظيفة رد الاتصال التي سيتم استدعاؤها عند حدوث الحدث. يحب:
document.adDeventListener ("Click" ، console.log ، false) ؛
يوضح مثال الرمز أعلاه وحدة الاتصال Console.log () في وضع الفقاعة عند النقر على المستند.
JavaScript مناسب بشكل خاص للبرمجة التي تعتمد على الحدث ، لأن وضع رد الاتصال يدعم البرامج لتشغيل غير متزامن.
نفذ الوقت
مثال آخر على استخدام وضع رد الاتصال هو عند استخدام طريقة المهلة التي توفرها كائن نافذة المتصفح: setTimeOut () و setInterval () ، مثل:
<script type = "text/javaScript"> var call = function () {console.log ("سيُطلب من 100 مللي ثانية ...") ؛ } ؛ setTimeout (اتصل ، 100) ؛ </script>وضع رد الاتصال في المكتبة
عند تصميم مكتبة JS ، ستكون وظيفة رد الاتصال مفيدًا. يجب أن تستخدم رمز المكتبة رمزًا قابل لإعادة الاستخدام قدر الإمكان ، ويمكن أن يساعد رد الاتصال في تحقيق هذا التعميم. عندما نقوم بتصميم مكتبة JS ضخمة ، فإن الحقيقة هي أن المستخدمين لا يحتاجون إلى معظمها ، يمكننا التركيز على الوظائف الأساسية وتوفير وظائف رد الاتصال في "Form" ، مما سيجعل من السهل علينا بناء وتخصيص طرق المكتبة
الكاري
الكاري هي تقنية تحول وظيفة إلى وظيفة جديدة مبسطة (إلى عدد أقل من المعلمات) عن طريق ملء معلمات متعددة إلى جسم دالة. ― 【يتقن في JavaScript】
ببساطة ، الكاري هو عملية تحويل ، أي عملية تحويل وظائفنا. كما هو موضح في المثال التالي:
<script type = "text/javaScript"> // curry add () function function add (x ، y) {var oldx = x ، oldy = y ؛ if (typeof oldy == "undefined") {return function (newy) {return oldx + newy ؛ } ؛ } // تطبيق الإرجاع تمامًا x+y ؛ } // test typeof add (5) ؛ // outputing "function" add (3) (4) ؛ // 7 // إنشاء وتخزين وظيفة جديدة var add2000 = add (2000) ؛ add2000 (10) ؛ // output 2010 </script>عند استدعاء ADD () لأول مرة ، فإنه يخلق إغلاقًا للوظيفة الداخلية التي تم إرجاعها. يخزن هذا الإغلاق قيم X و Y الأصلية في المتغيرات الخاصة OldX و Oldy.
الآن سنكون قادرين على استخدام طريقة عامة للكاري باستخدام أي وظيفة ، مثل:
<script type = "text/javaScript"> // وظيفة الوظيفة العادية إضافة (x ، y) {return x + y ؛ } // curry دالة للحصول على وظيفة جديدة var newadd = test (إضافة ، 5) ؛ NEWADD (4) ؛ // 9 // خيار آخر ، اتصل مباشرة باختبار الوظيفة الجديدة (إضافة ، 6) (7) ؛ // الإخراج 13 </SCRIPT>متى تستخدم الكاري
عندما يتم العثور على أنه يتم استدعاء الوظيفة نفسها ومعظم المعلمات التي تم تمريرها هي نفسها ، ثم قد تكون الوظيفة مرشحًا جيدًا للكاري