فهم متزامن وغير متزامن في جافا سكريبت - الجزء 2

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

طلب غريب

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

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

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

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

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

1. و setTimeout () طريقة

افترض أن لديك مجموعة من التعليمات البرمجية التي تريدها تنفيذ بعد وقت معين. من أجل القيام بذلك ، أنت فقط لفه في وظيفة, و إضافته إلى setTimeout () طريقة جنبا إلى جنب مع تأخير الوقت. بناء جملة setTimeout () على النحو التالي:

 setTimeout (الوظيفة ، تأخير الوقت ، arg ...) 

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

 setTimeout (function () console.log ('hey')، 3000)؛ 

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

عندما تنتهي الموقت ، رسالة جديدة ينضم إلى قائمة الانتظار, وحلقة الحدث تلتقطها عندما تكون مكالمة المكالمة مجانية بعد معالجة جميع الرسائل قبلها - وبالتالي يعمل الرمز بشكل غير متزامن.

2. اجاكس

أجاكس (JavaScript غير متزامن و XML) هو مفهوم يستخدم مدعوم (XHR) API to تقديم طلبات الخادم و التعامل مع الردود.

عندما تجعل المتصفحات طلبات الخادم دون استخدام XMLHttpRequest ، فإن تحديث الصفحة و يعيد تحميل واجهة المستخدم الخاصة به. عندما تتم معالجة الطلبات والردود بواسطة XHR API ، و يبقى UI تتأثر.

لذلك ، في الأساس الهدف هو تقديم طلبات دون إعادة تحميل الصفحة. الآن ، أين هو “غير متزامن” في هذا؟ إن استخدام رمز XHR (الذي سنراه في لحظة) لا يعني أنه AJAX ، لأن XHR API يمكن العمل بطرق متزامن وغير متزامن.

XHR بشكل افتراضي تم تعيين ل العمل بشكل غير متزامن. عندما تقدم وظيفة طلب باستخدام XHR ، فإنه يعود دون انتظار الرد.

إذا تم تكوين XHR ل كن متزامن, ثم تنتظر الوظيفة حتى تلقي استجابة ومعالجتها قبل العودة.

مثال على الكود 1

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

 var xhr = new XMLHttpRequest ()؛ xhr.open ("GET" ، url) ؛ xhr.send ()؛ 

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

مثال على الكود 2

ال hello.txt الملف في هذا المثال هو ملف نصي بسيط يحتوي على النص "مرحبًا". ال استجابة خاصية XHR غير صالحة ، لأنها لم تُخرج النص "مرحبًا".

 var xhr = new XMLHttpRequest ()؛ xhr.open ("GET"، "hello.txt")؛ xhr.send ()؛ دوكمنت (xhr.response)؛ // سلسلة فارغة 

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

 var xhr = new XMLHttpRequest ()؛ xhr.open ("GET"، "hello.txt")؛ xhr.send ()؛ يكتب xhr.onload = function () document.write (this.response) // "hello" إلى المستند 

الاستجابة داخل الحدث الحمل مخرجات 'مرحبا', النص الصحيح.

يُفضل اتباع الطريقة غير المتزامنة ، حيث إنها لا تمنع البرامج النصية الأخرى حتى يتم إكمال الطلب.

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

 var xhr = new XMLHttpRequest ()؛ xhr.open ("GET"، "hello.txt"، false)؛ xhr.send ()؛ دوكمنت (xhr.response)؛ // يكتب "مرحبا" لتوثيق 

لماذا تعلم كل هذا?

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

إذا كنت تعرف كيف يناسب اللغز ، يمكنك ذلك تجنب هذا الارتباك. أنت تعرف أن تأخير الوقت في setTimeout () لا يشير إلى الوقت عندما يبدأ تنفيذ التعليمات البرمجية, لكن الوقت عندما تنتهي الموقت وانتظار رسالة جديدة ، والتي لن تتم معالجتها إلا عندما تكون مكدس الاستدعاءات مجانية للقيام بذلك.