دعنا نتحدث عن عدم التزامن في جافا سكريبت وكيف نكون غير متزامن

لماذا تحتاج غير متزامن؟ لماذا؟ دعونا نرى قطعة من الكود.

السؤال 1:

 لـ (var i = 0 ؛ i <100000 ؛ i ++) {} ALERT ('Hello World !!!') ؛

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

السؤال 2:

عادة ما نحتاج إلى حل هذه المشكلة. إذا احتجنا إلى إضافة رمز البرنامج النصي إلى الرأس ، فسنقوم عمومًا بكتابة الرمز في window.onload (إذا تم تشغيل DOM). هل فكرت يومًا لماذا نحتاج إلى إضافة window.onload . والسبب هو أنه عندما تقوم بتشغيل DOM ، فإن متصفح كود HTML وراء النص لم يبدأ في التحميل ، لكنك تفكر في الزواج منها قبل ولادتها. هل هذا ممكن؟ بالطبع إنه مستحيل ، إضافة نافذة. يمكن أن يكون السبب في ذلك هو أن الرمز الموجود في window.onload يتم تنفيذ onload بعد تحميل المستند بالكامل ، وهو ما يعادل غير متزامن.

السؤال 3:

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

ما هو الموضوع الفردي؟

يمكنك أن تفهم بهذه الطريقة أن مؤشر ترابط واحد هو تنفيذ شرائح الكود ، وتنفيذ أولاً ، ثم تنفيذ السلاح التالي بعد اكتمال السلطة السابقة.

إذن أي JS غير متزامن؟

أعتقد أن هذا الشيء يستخدم تقريبًا بشكل سيء. إنه setTimeOut/setInterval وبالطبع Ajax. أعتقد أن الجميع يعرف أياكس غير متزامن. بالطبع ، يمكن أن يكون متزامنًا أيضًا ، لكن لا أحد يفعل ذلك. ومع ذلك ، قد لا يعرف بعض الأصدقاء بشكل مختلف عن عدم التزامن SetTimeout و SetInterval. دعنا نتحدث عن سبب عدم التزامن settimeout.

 setTimeOut (function () {console.log (0) ؛} ، 0) console.log (1) ؛ // 1 // 0

بعد تشغيل هذا الرمز ، المطبوعات الأولى 1 بدلاً من 0. هل بدأ بعض الأصدقاء في الخلط؟ على الرغم من قمنا بتعيين setTimeOut لتنفيذ console.log(0) بعد 0 ثانية ، فإن SetTimeOut مميز للغاية لأنه غير متزامن. دعنا نضع جانباً سبب كون الطباعة 1 ثم 0. دعنا نتحدث عن ما هو غير متزامن.

ما هو غير متزامن؟

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

دعنا نعود إلى القسم السابق من settimeout. إنه يعمل مثل هذا. منذ اللحظة التي تحدد فيها setTimeOut (بغض النظر عما إذا كان الوقت 0 أم لا) ، لن يقوم JS بتنفيذ هذا الرمز مباشرة ، ولكنه سيلقيه في قائمة انتظار الحدث. فقط بعد كل مهام التزامن على الصفحة ، سيتم تنفيذ الكود في قائمة انتظار الحدث. ما هو التزامن؟ بصرف النظر عن الكود غير المتزامن ، فهو مزامنة -_-.

كيفية تنفيذ JS غير المتزامن؟

　1. استخدم setTimout لتحقيق عدم التزامن

 setTimeOut (function () {console.log (document.getElementByTagName ('body') [0]) ؛} ، 0)

ولكن هناك مشكلة صغيرة مع SetTimeOut ، وهو أن الوقت غير دقيق. إذا كنت ترغب في تنفيذ هذا الرمز بشكل أسرع ، فيمكننا استخدام وظيفة توفرها HTML5.

 requestAnimationFrame (function () {console.log (document.getElementByTagName ('body') [0]) ؛})

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

2. قم بإنشاء علامات البرنامج النصي ديناميكيًا

 var head = document.getElementByTagName ('head') [0]

3. استخدم التأجيل/Async المقدم بواسطة البرنامج النصي

 <script src = "xx.js" defer> </script>

تأجيل: يتم تنفيذ هذا الرمز فقط بعد تحميل الصفحة.

 <script src = "xx.js" async> </script>

غير متزامن: تنفيذ رمز النص بشكل غير متزامن

ومع ذلك ، فإن عدم التزامن هو أيضًا عيب ، مثل الكود التالي:

الرمز العادي:

 جرب {رمي خطأ جديد ('Hello World') ؛} catch (err) {console.log (err) ؛} // error: hello world (...)

الرمز غير المتزامن:

 جرب {setTimout (function () {رمي خطأ جديد ('Hello World') ؛} ، 0)} catch (err) {console.log (err) ؛} // referenererror: لم يتم تعريف setTimout (...)

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

لخص

انتهى الأمر غير المتزامن في JS وكيفية تحقيق ذلك بشكل أساسي. إنها كليشيهات حول JS غير متزامن ، لكنني ما زلت آمل أن يكون محتوى هذه المقالة مفيدًا للجميع.