குறிப்பிட்ட ஜாவாஸ்கிரிப்ட் நேர இடைவெளியில் செயல்களை மீண்டும் செய்யவும். jQuery செயல்பாட்டின் எடுத்துக்காட்டுகள் setTimeout()

வீடு / தொழில்நுட்பங்கள்

விண்டோ மற்றும் ஒர்க்கர் இடைமுகங்களில் வழங்கப்படும் setInterval() முறையானது, ஒரு செயல்பாட்டை மீண்டும் மீண்டும் அழைக்கிறது அல்லது ஒவ்வொரு அழைப்பிற்கும் இடையே ஒரு குறிப்பிட்ட நேர தாமதத்துடன் குறியீடு துணுக்கை செயல்படுத்துகிறது.

இது இடைவெளியை தனித்துவமாக அடையாளம் காணும் இடைவெளி ஐடியை வழங்குகிறது, எனவே clearInterval() ஐ அழைப்பதன் மூலம் அதை அகற்றலாம். இந்த முறை WindowOrWorkerGlobalScope mixin மூலம் வரையறுக்கப்படுகிறது. தொடரியல் = var இடைவெளி ஐடிநோக்கம் .setInterval(, செயல்பாடு, [தாமதம், arg1, ...]); தொடரியல் = var இடைவெளி ஐடிநோக்கம் arg2, செயல்பாடுகுறியீடு ); அளவுருக்கள் செயல்பாடு ஒரு செயல்பாடு ஒவ்வொரு தாமதம் மில்லி விநாடிகளிலும் செயல்படுத்தப்படும். செயல்பாடு எந்த வாதங்களும் அனுப்பப்படவில்லை, மேலும் வருவாய் மதிப்பு எதிர்பார்க்கப்படாது.குறியீடு ஒரு விருப்ப தொடரியல் ஒரு செயல்பாட்டிற்கு பதிலாக ஒரு சரத்தை சேர்க்க உங்களை அனுமதிக்கிறது, இது ஒவ்வொரு தாமத மில்லி விநாடிகளிலும் தொகுக்கப்பட்டு செயல்படுத்தப்படுகிறது. இந்த தொடரியல் உள்ளது .setInterval(பரிந்துரைக்கப்படவில்லை

அதே காரணங்களுக்காக eval() ஐப் பயன்படுத்துவது ஒரு பாதுகாப்பு ஆபத்தை ஏற்படுத்துகிறது. தாமதம் நேரம், மில்லி விநாடிகளில் (ஆயிரத்தில் ஒரு வினாடி), டைமர் குறிப்பிட்ட செயல்பாடு அல்லது குறியீட்டின் செயல்பாட்டிற்கு இடையில் தாமதமாக வேண்டும். தாமத மதிப்புகளின் அனுமதிக்கப்பட்ட வரம்பு பற்றிய விவரங்களுக்கு கீழே பார்க்கவும். arg1, ..., argN விருப்பமான கூடுதல் வாதங்கள் குறிப்பிட்ட செயல்பாட்டிற்கு அனுப்பப்படும்

டைமர் காலாவதியானவுடன்.

குறிப்பு: முதல் தொடரியலில் setInterval() க்கு கூடுதல் வாதங்களை அனுப்புவது வேலை செய்யாது

இன்டர்நெட் எக்ஸ்புளோரர்

9 மற்றும் அதற்கு முந்தையது. அந்த உலாவியில் இந்தச் செயல்பாட்டைச் செயல்படுத்த விரும்பினால், நீங்கள் பாலிஃபில்லைப் பயன்படுத்த வேண்டும் (பிரிவைப் பார்க்கவும்).

திரும்ப மதிப்பு

திரும்பிய இடைவெளி ஐடி என்பது எண், பூஜ்ஜியம் அல்லாத மதிப்பாகும், இது setInterval()க்கான அழைப்பின் மூலம் உருவாக்கப்பட்ட டைமரை அடையாளம் காட்டுகிறது; காலக்கெடுவை ரத்து செய்ய இந்த மதிப்பை அனுப்பலாம்.

Var intervalID = window.setInterval(myCallback, 500, "அளவுரு 1", "அளவுரு 2"); செயல்பாடு myCallback(a, b) ( // உங்கள் குறியீடு இங்கே // அளவுருக்கள் முற்றிலும் விருப்பமானது. console.log(a); console.log(b); )

எடுத்துக்காட்டு 2: இரண்டு வண்ணங்களை மாற்றுதல்

பின்வரும் உதாரணம், ஸ்டாப் பட்டனை அழுத்தும் வரை ஃபிளாஷ் டெக்ஸ்ட்() செயல்பாட்டை வினாடிக்கு ஒருமுறை அழைக்கிறது.

setInterval/clearInterval உதாரணம் var nIntervId;

செயல்பாடு changeColor() (nIntervId = setInterval(flashText, 1000); ) செயல்பாடு flashText() (var oElem = document.getElementById("my_box"); oElem.style.color = oElem.style.color == "சிவப்பு" ? " நீலம்" : "சிவப்பு"; // oElem.style.color == "சிவப்பு" ? "நீலம்" : "சிவப்பு" என்பது ஒரு மும்முனை ஆபரேட்டர். ) செயல்பாடு stopTextColor() ( clearInterval(nIntervId); )

வணக்கம் உலகம்

நிறுத்து

எடுத்துக்காட்டு 3: தட்டச்சுப்பொறி உருவகப்படுத்துதல்

பின்வரும் உதாரணம் தட்டச்சுப்பொறியை உருவகப்படுத்துகிறது, முதலில் அதை அழித்து பின்னர் மெதுவாகத் தட்டச்சு செய்யும் நோட்லிஸ்ட்டில் குறிப்பிட்ட தேர்வாளர்களின் குழுவுடன் பொருந்துகிறது.< nPos) { return true; } var oRel, bExit = false; if (aMap.length === nPos) { aMap.push(0); } while (aMap < oSheet.parts.length) { oRel = oSheet.parts]; scroll(oRel, nPos + 1, bEraseAndStop) ? aMap++ : bExit = true; if (bEraseAndStop && (oRel.ref.nodeType - 1 | 1) === 3 && oRel.ref.nodeValue) { bExit = true; oCurrent = oRel.ref; sPart = oCurrent.nodeValue; oCurrent.nodeValue = ""; } oSheet.ref.appendChild(oRel.ref); if (bExit) { return false; } } aMap.length--; return true; } function typewrite () { if (sPart.length === 0 && scroll(aSheets, 0, true) && nIdx++ === aSheets.length - 1) { clean(); return; } oCurrent.nodeValue += sPart.charAt(0); sPart = sPart.slice(1); } function Sheet (oNode) { this.ref = oNode; if (!oNode.hasChildNodes()) { return; } this.parts = Array.prototype.slice.call(oNode.childNodes); for (var nChild = 0; nChild < this.parts.length; nChild++) { oNode.removeChild(this.parts); this.parts = new Sheet(this.parts); } } var nIntervId, oCurrent = null, bTyping = false, bStart = true, nIdx = 0, sPart = "", aSheets = , aMap = ; this.rate = nRate || 100; this.play = function () { if (bTyping) { return; } if (bStart) { var aItems = document.querySelectorAll(sSelector); if (aItems.length === 0) { return; } for (var nItem = 0; nItem < aItems.length; nItem++) { aSheets.push(new Sheet(aItems)); /* Uncomment the following line if you have previously hidden your elements via CSS: */ // aItems.style.visibility = "visible"; } bStart = false; } nIntervId = setInterval(typewrite, this.rate); bTyping = true; }; this.pause = function () { clearInterval(nIntervId); bTyping = false; }; this.terminate = function () { oCurrent.nodeValue += sPart; sPart = ""; for (nIdx; nIdx < aSheets.length; scroll(aSheets, 0, false)); clean(); }; } /* usage: */ var oTWExample1 = new Typewriter(/* elements: */ "#article, h1, #info, #copyleft", /* frame rate (optional): */ 15); /* default frame rate is 100: */ var oTWExample2 = new Typewriter("#controls"); /* you can also change the frame rate value modifying the "rate" property; for example: */ // oTWExample2.rate = 150; onload = function () { oTWExample1.play(); oTWExample2.play(); }; span.intLink, a, a:visited { cursor: pointer; color: #000000; text-decoration: underline; } #info { width: 180px; height: 150px; float: right; background-color: #eeeeff; padding: 4px; overflow: auto; font-size: 12px; margin: 4px; border-radius: 5px; /* visibility: hidden; */ }

ஜாவாஸ்கிரிப்ட் தட்டச்சுப்பொறி - MDN எடுத்துக்காட்டு செயல்பாடு தட்டச்சுப்பொறி (sSelector, nRate) (செயல்பாடு சுத்தமான () ( clearInterval(nIntervId); bTyping = false; bStart = true; oCurrent = null; aSheets.length = nIdx = 0; ) செயல்பாடு, உருட்டல் , bEraseAndStop) ( என்றால் (!oSheet.hasOwnProperty("parts") || aMap.length

Mozilla Developer Network மூலம் CopyLeft 2012

[ விளையாடு | இடைநிறுத்தம் | நிறுத்து]

Vivamus blandit Massa ut metus mattis in fringilla lectus imperdiet. ப்ரோயின் ஏசி ஆண்டி எ பெலிஸ் ஆர்னரே வாகனம். Fusce pellentesque lacus vitae eros convallis ut mollis Magna pellentesque. Pellentesque placerat enim at lacus ultricies vitae facilisis nisi fringilla. டின்சிடுண்ட் டிஞ்சிடுண்ட் டிஞ்சிடுண்ட்.

ஜாவாஸ்கிரிப்ட் தட்டச்சுப்பொறி
நுல்லம் கொமோடோ சுசிபிட் லாக்கஸ் அல்லாத அலிகெட். Phasellus ac nisl lorem, sed facilisis ligula. Nam cursus lobortis placerat. Sed dui nisi, elementum eu sodales ac, placerat sit amet mauris. Pellentesque dapibus Telus ut ipsum aliquam eu Auctor dui Vehicula. க்விஸ்க் அல்ட்ரிஸ் லாரீட் எராட், அட் அல்ட்ரிசஸ் டார்ட்டர் சோடேல்ஸ் அல்ல. செட் வெனெனாடிஸ் லுக்டஸ் மேக்னா, அல்ட்ரிசிஸ் அல்ட்ரிசிஸ் இப்போது ஃப்ரிங்கில்லா போன்றது. ப்ரெசென்ட் ஸ்கெலரிஸ்க் யூர்னா விட்டே நிப்ஹ் ட்ரிஸ்டிக் வகையின் விளைவாக நெக்யூ லுக்டஸ். முழு எண், ஒரு போர்டா டெம்பஸ், வெலிட் ஜஸ்டோ ஃபெர்மெண்டம் எலிட், எ ஃபெர்மெண்டம் மெட்டஸ் நிசி யூ இயூ இப்சம். Vivamus eget augue vel dui viverra adipiscing congue ut Masa. பிரசென்ட் விட்டே ஈரோஸ் எரட், புல்வினார் லௌரீட் மேக்னா. Maecenas vestibulum mollis nunc in posuere. Pellentesque sit amet metus a turpis lobortis tempor eu vel tortor. க்ராஸ் சோடேல்ஸ் எலிஃபென்ட் இண்டர்டம்.

Duis lobortis sapien quis nisl luctus porttitor. இன் tempor semper libero, eu tincidunt dolor eleifend sit amet. உட் நெக் வெலிட் இன் டோலர் டின்சிடுண்ட் ரோன்கஸ் நோன் டயம். மோர்பி ஆக்டர் ஆர்னரே ஓர்சி, யூஸ்மோட் அல்லாத ஃபெலிஸ் கிராவிட நெக். குராபிடுர் எலிமெண்டம் நிசி எரோஸ் ருட்ரம் நெக் பிளான்டிட் டயம் பிளேஸ்ராட். ஏனென் டின்சிடுண்ட் ரிசஸ் உட் நிசி கன்செக்டெர் கர்சஸ். உட் விட்டே குவாம் எலிட். டோனெக் டிக்னிசிம் தற்காலிகமான விளைவுகளில் உள்ளது. அலிகாம் அலிகம் டயம் நோன் ஃபெலிஸ் கன்வாலிஸ் சுசிபிட். நல்ல வசதி. டோனெக் லாகஸ் ரிசஸ், டிக்னிசிம் மற்றும் ஃப்ரிங்கில்லா எட், எஜெஸ்டாஸ் வெல் ஈரோஸ். டுயிஸ் மலேசுவாடா அக்ம்சன் டுய், ஃப்ரிங்கில்லா மாரிஸ் பிப்ஸ்டார்டம் குயிஸ். க்ராஸ் அடிபிஸிங் அல்ட்ரிசிஸ் ஃபர்மெண்டம். பிப்ஸ்டார்டம் கான்டிமென்டம் ஃபுஜியட்.

Nam faucibus, ligula eu fringilla pulvinar, lectus tellus iaculis nunc, vitae scelerisque metus leo non metus. Proin mattis lobortis lobortis. க்விஸ்க் அக்யூம்சன் ஃபாசிபஸ் எராட், அல்லது பல்வேறு டார்ட்டர் அல்ட்ரிசிஸ் ஏசி. லோரெம் இப்சம் டோலர் சிட் அமெட், கான்செக்டெர் அடிபிஸ்சிங் எலிட். நான் இலவசம் இல்லை. Nullam tortor nunc, elementum a consectetur et, ultrices eu orci. லோரெம் இப்சம் டோலர் சிட் அமெட், கான்செக்டெர் அடிபிஸ்சிங் எலிட். Pellentesque a nisl eu sem vehicula egestas.

திரும்ப திரும்ப வாதங்கள்

முன்பு விவாதித்தபடி, இன்டர்நெட் எக்ஸ்புளோரர் பதிப்பு 9 மற்றும் அதற்குக் கீழே உள்ளவை setTimeout() அல்லது setInterval() இல் உள்ள கால்பேக் செயல்பாட்டிற்கு வாதங்களை அனுப்புவதை ஆதரிக்காது. பின்வரும் IE-குறிப்பிட்ட குறியீடு இந்த வரம்பைக் கடப்பதற்கான ஒரு முறையை விளக்குகிறது. பயன்படுத்த, உங்கள் ஸ்கிரிப்ட்டின் மேல் பின்வரும் குறியீட்டைச் சேர்க்கவும்.

/*\ |*| |*| IE-குறிப்பிட்ட பாலிஃபில் |*|க்கு தன்னிச்சையான வாதங்களை அனுப்ப உதவுகிறது ஜாவாஸ்கிரிப்ட் டைமர்களின் கால்பேக் செயல்பாடுகள் (HTML5 நிலையான தொடரியல்)..செட்இண்டர்வல் |*| https://site/User:fusionchess |*| |*| தொடரியல்: |*| var timeoutID = window.setTimeout(func, delay[, arg1, arg2, ...]); |*| var timeoutID = window.setTimeout(குறியீடு, தாமதம்); |*| var intervalID = window.setInterval(func, delay[, arg1, arg2, ...]); |*| var intervalID = window.setInterval(குறியீடு, தாமதம்); |*| \*/ என்றால் (document.all && !window.setTimeout.isPolyfill) ( var __nativeST__ = window.setTimeout; window.setTimeout = செயல்பாடு (vCallback, nDelay /*, argumentToPass1, argumentToPass2, முதலியன. */ வரிசை = வரிசை .prototype.slice.call(arguments, 2); return __nativeST__(vCallback instanceof Function () : vCallback, nDelay ); (var __nativeSI__ = window.setInterval; window.setInterval = செயல்பாடு (vCallback, nDelay /*, argumentToPass1, argumentToPass2, முதலியன. */) (var aArgs = Array.prototype. slice.call(arguments, 2); திரும்ப __nativeSI செயல்பாட்டின் நிகழ்வு () (vCallback.apply(null, aArgs); ) : vCallback, nDelay );

மற்றொரு சாத்தியம் என்னவென்றால், உங்கள் அழைப்பை அழைப்பதற்கு அநாமதேய செயல்பாட்டைப் பயன்படுத்துவது, இந்த தீர்வு சற்று விலை அதிகம். எடுத்துக்காட்டு:

Var intervalID = setInterval(function() ( myFunc("ஒன்று", "இரண்டு", "மூன்று"); ), 1000);

var intervalID = setInterval(function(arg1) ().bind(undefined, 10), 1000);

செயலற்ற தாவல்களுக்கு கெக்கோ 5.0 (Firefox 5.0 / Thunderbird 5.0 / SeaMonkey 2.2) தேவை

Gecko 5.0 (Firefox 5.0 / Thunderbird 5.0 / SeaMonkey 2.2) இல் தொடங்கி, செயலற்ற தாவல்களில் வினாடிக்கு ஒரு முறைக்கு மேல் சுடாதபடி இடைவெளிகள் இறுக்கப்படுகின்றன.

"இந்த" பிரச்சனை

நீங்கள் setInterval() அல்லது வேறு ஏதேனும் செயல்பாட்டிற்கு ஒரு முறையை அனுப்பும்போது, அது தவறான இந்த மதிப்புடன் செயல்படுத்தப்படும். இந்த சிக்கல் ஜாவாஸ்கிரிப்ட் குறிப்பில் விரிவாக விளக்கப்பட்டுள்ளது.

விளக்கம்

MyArray = ["பூஜ்யம்", "ஒன்று", "இரண்டு"]; myArray.myMethod = செயல்பாடு (sProperty) ( எச்சரிக்கை(arguments.length > 0 ? this : this); ); myArray.myMethod(); // "பூஜ்யம், ஒன்று, இரண்டு" myArray.myMethod(1); // "ஒன்" செட் டைம்அவுட் (myArray.myMethod, 1000) அச்சிடுகிறது; // 1 வினாடி செட் டைம்அவுட் (myArray.myMethod, 1500, "1") பிறகு "" அச்சிடுகிறது; // 1.5 வினாடிகளுக்குப் பிறகு "வரையறுக்கப்படவில்லை" என்று அச்சிடுகிறது // "இந்த" பொருளை .அழைப்பு வேலை செய்யாது. .myMethod // உண்மையில், இது ஒரு பிழையாக இருக்கும், ஏனெனில் setTimeout.call (myArray, myArray.myMethod, 2000); setTimeout.call(myArray, myArray.myMethod, 2500, 2);

ஜாவாஸ்கிரிப்ட்டில் உள்ள கால்பேக் செயல்பாட்டிற்கு இந்த பொருளை அனுப்ப வழிகள் இல்லை என்பதை நீங்கள் பார்க்க முடியும்.

சாத்தியமான தீர்வு

"இந்த" சிக்கலைத் தீர்ப்பதற்கான சாத்தியமான வழி, இரண்டு சொந்த setTimeout() அல்லது setInterval() உலகளாவிய செயல்பாடுகளை இரண்டாக மாற்றுவதாகும். பூர்வீகமற்ற Function.prototype.call முறை மூலம் தங்கள் அழைப்பை செயல்படுத்தும். பின்வரும் எடுத்துக்காட்டு சாத்தியமான மாற்றீட்டைக் காட்டுகிறது:

// ஜாவாஸ்கிரிப்ட் டைமர்கள் var __nativeST__ = window.setTimeout, __nativeSI__ = window.setInterval மூலம் "இந்த" பொருளின் பத்தியை இயக்கவும்; window.setTimeout = செயல்பாடு (vCallback, nDelay /*, argumentToPass1, argumentToPass2, முதலியன () ( vCallback.apply(oThis, aArgs); ) : vCallback, nDelay ); window.setInterval = செயல்பாடு (vCallback, nDelay /*, argumentToPass1, argumentToPass2, முதலியன () ( vCallback.apply(oThis, aArgs); ) : vCallback, nDelay );

இந்த இரண்டு மாற்றீடுகளும் IE இல் உள்ள டைமர்களின் கால்பேக் செயல்பாடுகளுக்கு தன்னிச்சையான வாதங்களின் HTML5 நிலையான பத்தியையும் செயல்படுத்துகின்றன. எனவே அவற்றைப் பயன்படுத்தலாம் தரமற்ற-இணக்கமற்றபாலிஃபில்களும். a க்கான பார்க்கவும் நிலையான-இணக்கமானபாலிஃபில்.

புதிய அம்ச சோதனை:

MyArray = ["பூஜ்யம்", "ஒன்று", "இரண்டு"]; myArray.myMethod = செயல்பாடு (sProperty) ( எச்சரிக்கை(arguments.length > 0 ? this : this); ); setTimeout(எச்சரிக்கை, 1500, "ஹலோ வேர்ல்ட்!"); // setTimeout மற்றும் setInterval ஆகியவற்றின் நிலையான பயன்பாடு பாதுகாக்கப்படுகிறது, ஆனால்... setTimeout.call(myArray, myArray.myMethod, 2000); // 2 வினாடிகள் setTimeout.call (myArray, myArray.myMethod, 2500, 2) பிறகு "பூஜ்யம், ஒன்று, இரண்டு" என்று அச்சிடுகிறது; // 2.5 வினாடிகளுக்குப் பிறகு "இரண்டு" அச்சிடுகிறது

அதன் மிகவும் சிக்கலான ஆனால் இன்னும் மட்டு பதிப்பிற்கு ( டெமான்) ஜாவாஸ்கிரிப்ட் டெமான்ஸ் மேலாண்மை பார்க்கவும். இந்த மிகவும் சிக்கலான பதிப்பு, ஒரு பெரிய மற்றும் அளவிடக்கூடிய முறைகளின் தொகுப்பைத் தவிர வேறில்லை டெமான்கட்டமைப்பாளர். இருப்பினும், தி டெமான்கன்ஸ்ட்ரக்டர் என்பது ஒரு குளோனைத் தவிர வேறில்லை MiniDemonகூடுதல் ஆதரவுடன் initமற்றும் தொடக்கம்செயல்பாட்டின் போது அறிவிக்கப்பட்ட செயல்பாடுகள் டீமன். எனவே தி MiniDemonகட்டமைப்பானது எளிமையான அனிமேஷன்களுக்கு பரிந்துரைக்கப்பட்ட வழியாக உள்ளது, ஏனெனில் டெமான்முறைகள் அதன் சேகரிப்பு இல்லாமல் அடிப்படையில் அதன் ஒரு குளோன் ஆகும்.

minidaemon.js /*\ |*| |*| :: MiniDaemon:: |*| |*| திருத்தம் #2 - செப்டம்பர் 26, 2014.செட்இடைவெளி |*| https://site/User:fusionchess |*| https://github.com/madmurphy/minidaemon.js |*| |*| இந்த கட்டமைப்பு GNU Lesser General Public License, பதிப்பு 3 அல்லது அதற்குப் பிறகு வெளியிடப்பட்டது. |*| http://www.gnu.org/licenses/lgpl-3.0.html |*| \*/ செயல்பாடு MiniDaemon (oowner, fTask, nRate, nLen) ( என்றால் (!(இது && MiniDaemon இன் நிகழ்வு)) ( திரும்ப; ) என்றால் (arguments.length< 2) { throw new TypeError("MiniDaemon - not enough arguments"); } if (oOwner) { this.owner = oOwner; } this.task = fTask; if (isFinite(nRate) && nRate >0) ( this.rate = Math.floor(nRate); ) என்றால் (nLen > 0) ( this.length = Math.floor(nLen); ) ) MiniDaemon.prototype.owner = null; MiniDaemon.prototype.task = null; MiniDaemon.prototype.rate = 100; MiniDaemon.prototype.length = முடிவிலி;< 1: this.INDEX + 1 >இந்த.நீளம்; ); MiniDaemon.prototype.synchronize = செயல்பாடு () ((this.PAUSED) என்றால் (திரும்பவும்; ) clearInterval(this.SESSION); this.SESSION = setInterval(MiniDaemon.forceCall, this.rate, this); ); MiniDaemon.prototype.pause = செயல்பாடு () ( clearInterval(this.SESSION); this.PAUSED = true; ); MiniDaemon.prototype.start = செயல்பாடு (bReverse) (var bBackw = Boolean(bReverse); என்றால் (this.BACKW === bBackw && (this.isAtEnd() || !this.PAUSED)) (திரும்பவும்; ) this.BACKW = bBackw; இது. PAUSED = தவறானது.

MiniDaemon கால்பேக் செயல்பாட்டிற்கு வாதங்களை அனுப்புகிறது. இந்த அம்சத்தை ஆதரிக்காத உலாவிகளில் நீங்கள் வேலை செய்ய விரும்பினால், மேலே பரிந்துரைக்கப்பட்ட முறைகளில் ஒன்றைப் பயன்படுத்தவும்.

தொடரியல்

var myDaemon = புதிய MiniDaemon( இந்த பொருள், திரும்ப அழைக்க[ , விகிதம் [, நீளம்]]);

பயன்பாட்டு குறிப்புகளின் விளக்கம்

setInterval() செயல்பாடு பொதுவாக அனிமேஷன்கள் போன்ற மீண்டும் மீண்டும் செயல்படுத்தப்படும் செயல்பாடுகளுக்கு தாமதத்தை அமைக்கப் பயன்படுகிறது. WindowOrWorkerGlobalScope.clearInterval() ஐப் பயன்படுத்தி நீங்கள் இடைவெளியை ரத்து செய்யலாம்.

உங்கள் செயல்பாட்டை அழைக்க விரும்பினால் ஒருமுறைகுறிப்பிட்ட தாமதத்திற்குப் பிறகு, பயன்படுத்தவும்.

தாமதக் கட்டுப்பாடுகள்

இடைவெளிகள் உள்ளமைக்கப்படுவது சாத்தியம்; அதாவது, setInterval()க்கான கால்பேக், மற்றொரு இடைவெளியில் இயங்கத் தொடங்குவதற்கு setInterval() ஐ அழைக்கலாம், முதல் இடைவெளி இன்னும் இயங்கும். இது ஏற்படுத்தக்கூடிய தாக்கத்தைத் தணிக்க செயல்திறன், இடைவெளிகள் ஐந்து நிலைகளுக்கு அப்பால் உள்ளமைக்கப்பட்டவுடன், உலாவி தானாகவே இடைவெளிக்கு 4 ms குறைந்தபட்ச மதிப்பைச் செயல்படுத்தும், ஆழமாக உள்ளமைக்கப்பட்ட அழைப்புகளில் 4 ms க்கு குறைவான மதிப்பைக் குறிப்பிடும் முயற்சிகள் 4 ms க்கு பின் செய்யப்படும்.

உலாவிகள் சில சூழ்நிலைகளில் இடைவெளிக்கு இன்னும் கடுமையான குறைந்தபட்ச மதிப்புகளைச் செயல்படுத்தலாம், இருப்பினும் இவை பொதுவானதாக இருக்கக்கூடாது. திரும்ப அழைப்பிற்கான அழைப்புகளுக்கு இடையே உள்ள உண்மையான நேர அளவு, கொடுக்கப்பட்ட தாமதத்தை விட அதிகமாக இருக்கலாம் என்பதையும் கவனத்தில் கொள்ளவும்; எடுத்துக்காட்டுகளுக்கு WindowOrWorkerGlobalScope.setTimeout() இல் குறிப்பிடப்பட்டுள்ளதை விட நீண்ட தாமதத்திற்கான காரணங்களைப் பார்க்கவும்.

செயல்படுத்தும் காலம் இடைவெளி அதிர்வெண்ணைக் காட்டிலும் குறைவாக இருப்பதை உறுதிசெய்யவும்

உங்கள் தர்க்கம் இடைவேளை நேரத்தை விட அதிக நேரம் எடுக்கும் சாத்தியம் இருந்தால், setTimeout() ஐப் பயன்படுத்தி பெயரிடப்பட்ட செயல்பாட்டை மீண்டும் மீண்டும் அழைக்க பரிந்துரைக்கப்படுகிறது. எடுத்துக்காட்டாக, setInterval()ஐப் பயன்படுத்தி ரிமோட் சர்வரில் ஒவ்வொரு 5 வினாடிகளுக்கும் வாக்கெடுப்பு நடத்தினால், நெட்வொர்க் தாமதம், பதிலளிக்காத சர்வர் மற்றும் பல சிக்கல்கள் கோரிக்கையை ஒதுக்கப்பட்ட நேரத்தில் முடிப்பதைத் தடுக்கலாம். எனவே, வரிசைப்படுத்தப்பட்ட XHR கோரிக்கைகளை நீங்கள் காணலாம்.

ஸ்கிரிப்டிங் மொழிகளில் நிரலாக்கத்தில், அவ்வப்போது ஒரு இடைநிறுத்தத்தை உருவாக்க வேண்டிய அவசியம் உள்ளது - நிரலின் செயல்பாட்டை சிறிது நேரம் இடைநிறுத்தவும், பின்னர் தொடர்ந்து வேலை செய்யவும். எடுத்துக்காட்டாக, VBS மற்றும் PHP ஸ்கிரிப்ட்களில் பின்வரும் முறைகள் சாத்தியமாகும்:

VBS: wscript.sleep 1500 (1.5 வினாடிகள் நிறுத்தவும்)

PHP: தூக்கம்(10); (10 வினாடிகள் நிறுத்தவும்)

இத்தகைய இடைநிறுத்தங்களின் போது, இயக்க நேர அமைப்பு (PHP அல்லது VBS) எதுவும் செய்யாது. ஜாவாஸ்கிரிப்டில் உள்ளுணர்வாகப் பயன்படுத்த முயற்சிக்கும் டெவலப்பர் விரும்பத்தகாத ஆச்சரியப்படுவார். பொதுவான தவறுஜாவாஸ்கிரிப்டில் இடைநிறுத்தத்தை உருவாக்க முயற்சிக்கும்போது இது போல் தெரிகிறது:

செயல்பாடு பேட்டெஸ்ட்() (க்கு (var i=1; i< 10; i++) { window.setTimeout("document.getElementById("test1").value += " + i, 900) } }

லூப்பின் போது, அடுத்த எண்ணை வரைவதற்கான திருப்பம் வரும்போது, உங்கள் setTimeout நேர்மையாக ஜாவாஸ்கிரிப்டை வேலை செய்வதை நிறுத்தி, 0.9 வினாடிகள் காத்திருந்து, உள்ளீட்டு புலத்தின் முடிவில் விரும்பிய எண்ணைச் சேர்த்து, பின்னர் தொடர்ந்து வேலை செய்யும் என்று நீங்கள் நினைக்கிறீர்கள். ஆனால் உண்மையில் இது அப்படி இல்லை: ஜாவாஸ்கிரிப்டில் உள்ள setInterval மற்றும் setTimeout அடைப்புக்குறிக்குள் குறிப்பிடப்பட்ட செயலை (அல்லது செயல்பாடு) செயல்படுத்துவதை தாமதப்படுத்துகிறது. எங்கள் எடுத்துக்காட்டில், பின்வருபவை நடக்கும்:

நான் = 1;

உள்ளீட்டு புலத்தில் "1" எண்ணைச் சேர்ப்பதை 0.9 வினாடிகள் தாமதப்படுத்தவும்;

இந்த சிக்கலை அமைத்த பிறகு, சுழற்சி தொடர்கிறது: i=2;

உள்ளீட்டு புலத்தில் "2" எண்ணைச் சேர்ப்பதை 0.9 வினாடிகள் தாமதப்படுத்தவும்;

உடனடியாக, எடுத்துக்காட்டாக, 1 எம்எஸ் (அதாவது, 900 எம்எஸ் உடன் ஒப்பிடும்போது விகிதாசாரமாக சிறியது): லூப் அதன் வேலையை கிட்டத்தட்ட உடனடியாகச் செய்யும், அதே நேரத்தில் பல ஒத்திவைக்கப்பட்ட பணிகளை உருவாக்கும். புதிய எண்களைச் சேர்ப்பதற்கு இடையில் இடைநிறுத்தப்படாமல், நிலுவையில் உள்ள அனைத்து "வரைதல்" பணிகளும் கிட்டத்தட்ட ஒரே நேரத்தில் முடிக்கப்படும் என்பதே இதன் பொருள். சுழற்சி தொடங்குகிறது; எல்லாம் 0.9 வினாடிகளுக்கு உறைகிறது; மற்றும் shirr - அனைத்து எண்களும் ஒன்றன் பின் ஒன்றாக ஒரு வரிசையில் சுடப்படுகின்றன.

அத்தகைய சூழ்நிலையில் setTimeout ஐ எவ்வாறு சரியாகப் பயன்படுத்துவது? இது சிக்கலானது. நீங்கள் செயல்பாட்டை அழைக்க வேண்டும் மீண்டும் மீண்டும்(செயல்பாட்டில் இருந்து அதே செயல்பாடு), மற்றும் இந்த செயல்முறை முடிவற்றதாக இல்லை, ஒரு நிறுத்த நிலையை அமைக்கவும் (உதாரணமாக, அச்சிடப்பட வேண்டிய எண்ணின் அளவு):

செயல்பாடு வெல்டெஸ்ட்() ( என்றால் (i< 9) { document.getElementById("test2").value += ++i window.setTimeout("welltest()", 400) } }

மேலும் i என்ற மாறியை செயல்பாட்டிற்கு வெளியே துவக்க வேண்டும் - எடுத்துக்காட்டாக, இது போன்றது:

இப்போது எல்லாம் சரியாக வேலை செய்கிறது (தாமத நேரத்தை 0.9 வினாடிகளில் இருந்து 0.4 வினாடிகளாகக் குறைத்துள்ளோம்). ஆனால் அத்தகைய பணிகளுக்கு, setTimeout ஐ விட setInterval ஐப் பயன்படுத்துவது மிகவும் தர்க்கரீதியானது (இதற்கு இரண்டு செயல்பாடுகள் தேவைப்படும் என்றாலும்):

செயல்பாடு besttest() ( window.i = 0 window.timer1 = window.setInterval("draw()", 400) ) function draw() ( document.getElementById("test3").value += ++i if (i >= 9) clearInterval(window.timer1) )

Javascirpt setInterval முறையின் தனித்தன்மை என்னவென்றால், அது "தானே" கடந்து செல்லாது, அது ஒரு சிறப்பு clearInterval முறையுடன் நிறுத்தப்பட வேண்டும். மேலும் எதை நிறுத்த வேண்டும் என்பதை தெளிவுபடுத்த, ஒத்திவைக்கப்பட்ட செயலுக்கான பணிக்கு ஒரு சிறப்பு அடையாளங்காட்டி ஒதுக்கப்பட்டுள்ளது - ஒரு டைமர்: window.timer1 = window.setInterval(...) .

setTimeout முறையால் உருவாக்கப்பட்ட பணிகளுக்கும் அடையாளங்காட்டிகளை ஒதுக்கலாம். அனைத்து டைமர் ஐடிகளும் ஒன்றுக்கொன்று வித்தியாசமாக இருக்க வேண்டும் (தற்போதைய உலாவி சாளரத்தில் தனித்தன்மை வாய்ந்தது). பின்னர் நீங்கள் சாளரத்தில் ஒத்திவைக்கப்பட்ட செயல்களைப் பயன்படுத்தும் பல்வேறு பணிகளை உருவாக்கலாம், மேலும் இந்த பணிகள் இணையாக செயல்படுத்தப்படும் (ஒரே நேரத்தில், கணினியில் போதுமான ஆதாரங்கள் இருந்தால்), இது அடிப்படையில் PHP அல்லது VBS இல் சாத்தியமற்றது.

பல ஜாவாஸ்கிரிப்ட் டைமர்கள் ஒரே நேரத்தில் இயங்கும் பக்கத்தின் உதாரணம் இங்கே: setinterval.htm (setinterval.js கோப்பில் ஜாவாஸ்கிரிப்ட் செயல்பாடுகள்). Esc விசையைப் பயன்படுத்தி அனைத்து பக்க டைமர்களையும் (மெனுவைத் தவிர) நிறுத்தலாம். அனைத்து எடுத்துக்காட்டு டைமர்களும் "இயற்கை" (மற்றும் சுருக்கமான i++ அல்ல) கவுண்ட்டவுனை அடிப்படையாகக் கொண்டவை - நேரம் அல்லது தூரம். அனைத்து "கடிகாரங்களும்" சிறப்பாக ஒத்திசைக்கப்பட்டுள்ளன (தெளிவுக்காக). தூரம் சார்ந்த டைமர்கள் "காட்டி" மற்றும் கீழ்தோன்றும் ("புல்-அவுட்") மெனுவில் பயன்படுத்தப்படுகின்றன.

கீழ்தோன்றும் மெனு

எங்கள் ஸ்லைடிங் மெனு உண்மையில் ஸ்லைடிங் ஆகும் ("தலைப்பு" என்பதன் கீழ் இருந்து): உறுப்புகளுக்கு இடையில் இடைவெளிகள் சிறப்பாக விடப்படுகின்றன, இதன் மூலம் அது எவ்வாறு வெளியேறுகிறது என்பதை நீங்கள் பார்க்கலாம். எதிர்பாராத விதமாக, வெவ்வேறு நீளங்களின் பட்டியல்களுக்கு சமமாக வெளியேறுவதை எங்களால் செய்ய முடியவில்லை என்று மாறியது - ஒருவேளை கணினியின் குறைந்த செயல்திறன் காரணமாக (AMD Athlon 999 MHz).

அழகு மற்றும் நல்லிணக்கத்திற்கு வெவ்வேறு மெனு உருப்படிகளின் பட்டியல்கள் ஒரே நேரத்தில் தோன்றுவது அவசியம் என்பது மிகவும் வெளிப்படையானது. அதாவது, நீண்ட பட்டியல்கள் மேலும் வெளியேற வேண்டும் அதிக வேகம், குறுகியவை - குறைந்த வேகத்தில். இதை இப்படி செயல்படுத்தலாம் என்று தோன்றுகிறது:

மொத்த "புறப்படும்" நேரத்தை நாங்கள் அமைத்துள்ளோம், எடுத்துக்காட்டாக, 200 எம்.எஸ்.

கீழ்தோன்றும் பட்டியலில் 20 px உயரம் இருந்தால், அதை 10 ms இடைவெளியில் ஒரு பிக்சல் கீழே நகர்த்தலாம் என்பது தெளிவாகத் தெரிகிறது - பின்னர் 200 ms இல் முழு பட்டியல் வெளிவரும்.

கீழ்தோன்றும் 40px உயரத்தில் இருந்தால், அதே நேரத்தில் பொருத்துவதற்கு ஒவ்வொரு 5msக்கும் ஒரு பிக்சலை கீழே நகர்த்த வேண்டும்.

இந்த தர்க்கத்தின்படி, கீழ்தோன்றும் பட்டியல் 200px உயரத்தில் இருந்தால், ஒவ்வொரு 1msக்கும் ஒரு பிக்சல் கீழே நகர்த்த வேண்டும். ஆனால் அத்தகைய வேகம் எங்கள் கணினியில் வேலை செய்யாது - ஒரு மில்லி வினாடியில் பட்டியலின் புதிய நிலையை வரைய உலாவிக்கு நேரமில்லை. ஆம். ஜாவாஸ்கிரிப்ட் எண்ணுவதற்கு நிர்வகிக்கிறது (எண்ணக்க என்ன இருக்கிறது?), ஆனால் உலாவி (பயர்பாக்ஸ்) காட்ட நேரம் இல்லை. இணையத்திற்கான பொதுவான சூழ்நிலை.

எனவே, ஊன்றுகோல் உதவியுடன் மட்டுமே மெனு புறப்படும் நேரத்தை அதிகமாகவோ அல்லது குறைவாகவோ சமப்படுத்த முடியும், மேலும் இது எவ்வாறு அதிகமாக வேலை செய்யும் என்பது இன்னும் தெளிவாகத் தெரியவில்லை வேகமான கணினி. ஆனால் நாம் மெதுவான ஒன்றை நம்ப வேண்டும், இல்லையா? அல்காரிதம் (கணினியின் வேகத்தை கணக்கில் எடுத்துக் கொள்ளாமல்) இது போன்ற ஒன்றை மாற்றுகிறது:

பட்டியலைச் சரிபார்ப்பதற்கான மொத்த நேரத்தை அமைக்கவும்: நேரம் = 224 (மிஎஸ்).

சுழற்சியில் ஒரு இடைவெளிக்கு குறைந்தபட்ச நேரத்தை அமைக்கிறோம்: தாமதம் = 3 (எம்எஸ்).

பட்டியலை நகர்த்துவதற்கான குறைந்தபட்ச படியை அமைக்கவும்: ஆஃப்செட் = 1 (px).

பட்டியலின் உயரத்தைப் பொறுத்து இவை அனைத்தையும் மாற்றுகிறோம்: 1) தாமதம் (இடைவெளி) நேரத்தை உயரத்திற்கு தலைகீழ் விகிதத்தில் அதிகரிக்கவும் மற்றும் மொத்த நேர நேரத்திற்கு நேரடியாக விகிதாசாரமாகவும் (224 உயரத்தில் குணகம் 1 ஆகும்); 2) உயரம் 40 px ஐ விட அதிகமாக இருந்தால், உயரத்திற்கு விகிதத்தில் குறைந்தபட்ச படியை அதிகரிக்கவும். நிலையான "40" மெதுவான கணினிக்கு சோதனை முறையில் பெறப்பட்டது. ஒரு பென்டியம் 4 CPU 2.53GHz கணினியில் சோதனைகள் அதே எண்ணை வெளிப்படுத்தின - 40. இல்லையெனில், டைமர்கள் ஒழுங்கற்றதாக இருக்கும், பட்டியல்கள் படிநிலைக்கு வெளியே செல்கின்றன.

இப்போது பட்டியல்கள் அதிகமாகவோ அல்லது குறைவாகவோ வெளிவருகின்றன. அதிகமாகவோ அல்லது குறைவாகவோ ஒத்த நேரத்திற்கு. setinterval.htm பக்கத்தில்.

இங்கே புரூஸ் வருகிறார்:

செயல்பாடு slide_do(obj, maxtop, offset) ( if (getTopLeft(obj).top< maxtop) { obj.style.top = getTopLeft(obj).top + offset } else { if (obj && obj.timer1) { clearInterval(obj.timer1) obj.timer1 = null } } }

உள்ளமை பட்டியல்களை மெனுவிற்கு வெளியே தள்ளும் செயல்பாடு, நாம் பார்க்க முடியும் என, மிகவும் எளிமையானது. இந்த வரியைப் போன்ற ஏதாவது ஒன்றை இயக்குவது மட்டுமே எஞ்சியுள்ளது:

Ts.timer1 = setInterval(function())(slide_do(ts, maxtop, offset)), தாமதம்)

சரி, தொடங்குவதற்கு முன், இந்த மேக்ஸ்டாப் மற்றும் ஆஃப்செட் அனைத்தையும் கணக்கிடுங்கள், மேலும் பட்டியலை மின்டாப் நிலையில் வைக்கவும். 40 வரிகளின் "பூர்வாங்க" ஸ்லைடு() செயல்பாடு இதைத்தான் செய்கிறது. மற்றும் அனைத்தும் ஒன்றாக - setinterval.js கோப்பில். ஆம், சேர்க்கப்பட்ட பாணிகள் கோப்பு இல்லாமல் இந்த முட்டாள்தனம் வேலை செய்யாது

ஜாவாஸ்கிரிப்ட் டைமர்கள் எவ்வாறு செயல்படுகின்றன என்பதைப் புரிந்துகொள்வது மிகவும் முக்கியம். பெரும்பாலும் அவர்களின் நடத்தை மல்டித்ரெடிங்கைப் பற்றிய நமது உள்ளுணர்வு புரிதலுடன் பொருந்தவில்லை, உண்மையில் அவை ஒரே நூலில் செயல்படுத்தப்படுவதே இதற்குக் காரணம். டைமர்களை நிர்வகிக்கக்கூடிய நான்கு செயல்பாடுகளைப் பார்ப்போம்:

var id = setTimeout(fn, தாமதம்); - கொடுக்கப்பட்ட தாமதத்திற்குப் பிறகு கொடுக்கப்பட்ட செயல்பாட்டை அழைக்கும் எளிய டைமரை உருவாக்குகிறது. டைமரை இடைநிறுத்தக்கூடிய தனித்துவமான ஐடியை செயல்பாடு வழங்குகிறது.
var id = setInterval(fn, தாமதம்); - setTimeout போன்றது, ஆனால் ஒரு குறிப்பிட்ட இடைவெளியில் (நிறுத்தப்படும் வரை) செயல்பாட்டைத் தொடர்ந்து அழைக்கிறது.
clearInterval(id);, clearTimeout(id); - ஒரு டைமர் ஐடியை ஏற்றுக்கொள்கிறது (மேலே விவரிக்கப்பட்ட செயல்பாடுகளில் ஒன்றின் மூலம் திரும்பியது) மற்றும் கால்பேக்"a செயல்படுத்துவதை நிறுத்துகிறது.

கருத்தில் கொள்ள வேண்டிய முக்கிய யோசனை என்னவென்றால், டைமர் தாமத காலத்தின் துல்லியம் உத்தரவாதம் இல்லை. தொடங்குவதற்கு, உலாவியானது அனைத்து ஒத்திசைவற்ற ஜாவாஸ்கிரிப்ட் நிகழ்வுகளையும் ஒரு தொடரிழையில் (மவுஸ் கிளிக்குகள் அல்லது டைமர்கள் போன்றவை) செயல்படுத்துகிறது மற்றும் அந்த நிகழ்வின் முறை வரும் நேரத்தில் மட்டுமே. இது பின்வரும் வரைபடத்தால் சிறப்பாக நிரூபிக்கப்பட்டுள்ளது:

இந்த படத்தில் எடுக்க நிறைய தகவல்கள் உள்ளன, ஆனால் அதைப் புரிந்துகொள்வது ஜாவாஸ்கிரிப்ட் ஒத்திசைவு எவ்வாறு செயல்படுகிறது என்பதைப் பற்றிய ஆழமான புரிதலை உங்களுக்கு வழங்கும். இந்த விளக்கப்படம் நேரத்தை செங்குத்தாக மில்லி விநாடிகளில் குறிக்கிறது, நீலத் தொகுதிகள் செயல்படுத்தப்பட்ட ஜாவாஸ்கிரிப்ட் குறியீட்டின் தொகுதிகளைக் காட்டுகின்றன. எடுத்துக்காட்டாக, முதல் தொகுதி சராசரியாக 18ms இல் செயல்படுத்தப்படுகிறது, ஒரு மவுஸ் கிளிக் சுமார் 11ms வரை செயல்படுத்துவதைத் தடுக்கிறது.

ஜாவாஸ்கிரிப்ட் ஒரு குறியீட்டை மட்டுமே இயக்க முடியும் (ஒற்றை-திரிக்கப்பட்ட செயல்பாட்டின் காரணமாக), அவை ஒவ்வொன்றும் மற்ற ஒத்திசைவற்ற நிகழ்வுகளின் செயல்பாட்டைத் தடுக்கின்றன. அதாவது ஒரு ஒத்திசைவற்ற நிகழ்வு நிகழும்போது (மவுஸ் கிளிக், டைமர் அழைப்பு அல்லது XMLHttp கோரிக்கையை நிறைவு செய்தல் போன்றவை), அது ஒரு வரிசையில் சேர்க்கப்பட்டு பின்னர் செயல்படுத்தப்படும் (உலாவியைப் பொறுத்து செயல்படுத்தல் மாறுபடும், ஆனால் ஒப்புக்கொள்வோம் அதை "வரிசை" என்று அழைக்கவும்) .

தொடங்குவதற்கு, ஜாவாஸ்கிரிப்ட் தொகுதிக்குள் இரண்டு டைமர்கள் தொடங்கும் என்று கற்பனை செய்துகொள்வோம்: 10எம்எஸ் தாமதத்துடன் செட் டைம்அவுட் மற்றும் அதே தாமதத்துடன் செட்இண்டர்வல். டைமர் எப்போது தொடங்கும் என்பதைப் பொறுத்து, குறியீட்டின் முதல் தொகுதியை நாம் இன்னும் முடிக்காத தருணத்தில் அது சுடும். இருப்பினும், இது உடனடியாக சுடாது என்பதை நினைவில் கொள்க (ஒற்றை த்ரெடிங் காரணமாக இது சாத்தியமில்லை). அதற்கு பதிலாக, ஒத்திவைக்கப்பட்ட செயல்பாடு வரிசைப்படுத்தப்பட்டு அடுத்த கிடைக்கும் தருணத்தில் செயல்படுத்தப்படும்.

மேலும், முதல் ஜாவாஸ்கிரிப்ட் பிளாக்கின் செயல்பாட்டின் போது, ஒரு மவுஸ் கிளிக் ஏற்படுகிறது. இந்த ஒத்திசைவற்ற நிகழ்விற்கான ஹேண்ட்லரை (அது ஒத்திசைவற்றது, ஏனெனில் அதை நம்மால் கணிக்க முடியாது) இந்த நேரத்தில் உடனடியாக செயல்படுத்த முடியாது, எனவே இது டைமர் போன்ற ஒரு வரிசையில் முடிவடைகிறது.

ஜாவாஸ்கிரிப்ட் குறியீட்டின் முதல் தொகுதி செயல்படுத்தப்பட்ட பிறகு, உலாவி "எது செயல்படுத்தப்படுவதற்கு காத்திருக்கிறது?" என்ற கேள்வியைக் கேட்கிறது. IN இந்த வழக்கில்மவுஸ் கிளிக் ஹேண்ட்லரும் டைமரும் நிலுவையில் உள்ளன. உலாவி அவற்றில் ஒன்றைத் தேர்ந்தெடுத்து (கிளிக் ஹேண்ட்லர்) அதைச் செயல்படுத்துகிறது. செயல்படுத்தும் வரிசையில் அடுத்த கிடைக்கும் நேரத்திற்காக டைமர் காத்திருக்கும்.

மவுஸ் கிளிக் ஹேண்ட்லர் இயக்கும் போது, முதல் இடைவெளி-கால்பேக் எரிகிறது என்பதை நினைவில் கொள்ளவும். டைமர்-கால்பேக் போலவே, இது வரிசையில் இருக்கும். இருப்பினும், இடைவெளி மீண்டும் எரியும் போது (டைமர்-கால்பேக் இயங்கும் போது), அது வரிசையில் இருந்து அகற்றப்படும். ஒரு பெரிய அளவிலான குறியீட்டை இயக்கும் போது அனைத்து இடைவெளி-கால்பேக்குகளும் வரிசைப்படுத்தப்பட்டிருந்தால், இது பல செயல்பாடுகளை அழைக்கும் வரை காத்திருக்கும், அவற்றுக்கிடையே எந்த தாமதமும் இல்லாமல், செயலிழப்பை முடிக்கும் வரை உலாவிகள் காத்திருக்கின்றன வரிசையில் இன்னொன்றைச் சேர்ப்பதற்கு முன், வரிசையில் விட்டுவிட்டார்.

எனவே, இடைவெளி-கால்பேக்கின் மூன்றாவது துப்பாக்கிச் சூடு ஏற்கனவே செயல்படுத்தப்பட்ட தருணத்துடன் ஒத்துப்போகும் நிகழ்வை நாம் அவதானிக்கலாம். இது ஒரு முக்கியமான விஷயத்தை விளக்குகிறது: இடைவெளிகள் தற்போது இயங்குவதைப் பொருட்படுத்தாது, அவை செயல்படுத்தப்படுவதற்கு இடையில் தாமதமான காலத்தைப் பொருட்படுத்தாமல் வரிசையில் சேர்க்கப்படும்.

இறுதியாக, இரண்டாவது இடைவெளி-கால்பேக் முடிந்ததும், ஜாவாஸ்கிரிப்ட் எஞ்சின் இயக்குவதற்கு எதுவும் இல்லை என்று பார்ப்போம். புதிய ஒத்திசைவற்ற நிகழ்வுகள் நிகழும் வரை உலாவி மீண்டும் காத்திருக்கிறது என்பதே இதன் பொருள். இது 50எம்எஸ் குறியில் நடக்கும், அங்கு இடைவெளி-கால்பேக் மீண்டும் வேலை செய்யும். இந்த கட்டத்தில் அதைத் தடுக்க எதுவும் இருக்காது, எனவே அது உடனடியாக வேலை செய்யும்.

setTimeout மற்றும் setInterval இடையே உள்ள வித்தியாசத்தை நன்றாக விளக்கும் ஒரு உதாரணத்தைப் பார்ப்போம்.
setTimeout(function())( /* சில நீண்ட குறியீடு தொகுதி... */ setTimeout(arguments.callee, 10); 10);
setInterval(function())( /* சில நீண்ட குறியீடு தொகுதி... */ ), 10);

இந்த இரண்டு விருப்பங்களும் முதல் பார்வையில் சமமானவை, ஆனால் உண்மையில் அவை இல்லை. setTimeoutஐப் பயன்படுத்தும் குறியீடு முந்தைய அழைப்பிற்குப் பிறகு எப்போதும் குறைந்தது 10ms தாமதமாக இருக்கும் (அது அதிகமாக இருக்கலாம், ஆனால் குறைவாக இருக்காது), அதே சமயம் setInterval ஐப் பயன்படுத்தும் குறியீடு முந்தைய அழைப்பு எப்போது நிகழ்ந்தது என்பதைப் பொருட்படுத்தாமல் ஒவ்வொரு 10msக்கும் அழைக்கப்படும்.
மேலே கூறப்பட்ட அனைத்தையும் சுருக்கமாகக் கூறுவோம்:
- setTimeout மற்றும் setInterval செயல்பாடுகள் ஒத்திசைவற்ற குறியீட்டில் அடிப்படையில் வேறுபட்ட முறையில் செயல்படுத்தப்படுகின்றன,
- டைமரை இயக்க முடியாவிட்டால் இந்த நேரத்தில், இது அடுத்த செயலாக்க புள்ளி வரை தாமதமாகும் (இது விரும்பிய தாமதத்தை விட நீண்டதாக இருக்கும்),
- இடைவெளிகள் (setInterval) குறிப்பிட்ட தாமதத்தை விட அதிக நேரம் எடுக்கும் பட்சத்தில் தாமதமின்றி ஒன்றன் பின் ஒன்றாக செயல்படுத்தப்படும்.

இவை அனைத்தும் மிக மிக அதிகம் முக்கியமான தகவல்வளர்ச்சிக்காக. ஜாவாஸ்கிரிப்ட் எஞ்சின் எவ்வாறு செயல்படுகிறது என்பதை அறிவது, குறிப்பாக பல ஒத்திசைவற்ற நிகழ்வுகளுடன் (இது பெரும்பாலும் நிகழ்கிறது), மேம்பட்ட பயன்பாடுகளை உருவாக்குவதற்கான சிறந்த அடித்தளத்தை அமைக்கிறது.

ஆதாரம்: http://learn.javascript.ru/settimeout-setinterval

ஏறக்குறைய அனைத்து ஜாவாஸ்கிரிப்ட் செயலாக்கங்களும் உள்ளக டைமர் ஷெட்யூலரைக் கொண்டுள்ளன, இது ஒரு குறிப்பிட்ட காலத்திற்குப் பிறகு அழைக்கப்படும் செயல்பாட்டைத் திட்டமிட உங்களை அனுமதிக்கிறது.

குறிப்பாக, இந்த அம்சம் உலாவிகளிலும் Node.JS சர்வரிலும் ஆதரிக்கப்படுகிறது.

நேரம் முடிந்தது

தொடரியல்:

var timerId = setTimeout(func/code, தாமதம்[, arg1, arg2...])

அளவுருக்கள்:

செயல்பாடு/குறியீடு
- செயல்படுத்தப்பட வேண்டிய ஒரு செயல்பாடு அல்லது குறியீட்டின் வரி.
- சரம் இணக்கத்திற்காக பராமரிக்கப்படுகிறது மற்றும் பரிந்துரைக்கப்படவில்லை.
செயல்பாடு
- மில்லி விநாடிகளில் தாமதம், 1000 மில்லி விநாடிகள் 1 வினாடிக்கு சமம்.
arg1, arg2…
- செயல்பாட்டிற்கு அனுப்ப வேண்டிய வாதங்கள். IE9-ல் ஆதரிக்கப்படவில்லை.
- தாமத அளவுருவில் குறிப்பிடப்பட்ட நேரத்திற்குப் பிறகு செயல்பாடு செயல்படுத்தப்படும்.

எடுத்துக்காட்டாக, பின்வரும் குறியீடு ஒரு வினாடிக்குப் பிறகு எச்சரிக்கையை ("ஹலோ") தூண்டும்:

செயல்பாடு செயல்பாடு () ( எச்சரிக்கை ("ஹலோ" ); ) setTimeout(func, 1000 );

முதல் வாதம் ஒரு சரம் என்றால், மொழிபெயர்ப்பாளர் அந்த சரத்திலிருந்து ஒரு அநாமதேய செயல்பாட்டை உருவாக்குகிறார்.

அதாவது, இந்த பதிவு சரியாக வேலை செய்கிறது:

SetTimeout("எச்சரிக்கை("ஹலோ")" , 1000 );

அதற்குப் பதிலாக அநாமதேய செயல்பாடுகளைப் பயன்படுத்தவும்:

SetTimeout(function () ( alert("Hello" ) ), 1000 );

செயல்பாடு மற்றும் சூழலுக்கான அளவுருக்கள்

அனைத்திலும் நவீன உலாவிகள் IE10 கொடுக்கப்பட்டால், செட் டைம்அவுட் செயல்பாடு அளவுருக்களைக் குறிப்பிட உங்களை அனுமதிக்கிறது.

கீழேயுள்ள எடுத்துக்காட்டு IE9-ஐத் தவிர எல்லா இடங்களிலும் "ஹலோ, நான் வாஸ்யா" என்பதை வெளியிடும்:

செயல்பாடு sayHi (யார்) ( எச்சரிக்கை("ஹலோ, நான் " + யார்); ) setTimeout(sayHi, 1000 , "Vasya" );

...இருப்பினும், பெரும்பாலான சந்தர்ப்பங்களில் எங்களுக்கு பழைய IE இலிருந்து ஆதரவு தேவை, மேலும் இது வாதங்களைக் குறிப்பிட உங்களை அனுமதிக்காது. எனவே, அவற்றை மாற்றுவதற்காக, அவர்கள் அழைப்பை அநாமதேய செயல்பாட்டில் மூடுகிறார்கள்:

செயல்பாடு sayHi (who) ( எச்சரிக்கை("Hi, I'm " + who); ) setTimeout(function () ( sayHi("Vasya") ), 1000 );

setTimeoutஐ அழைப்பது இந்த சூழலைக் கடக்காது.

குறிப்பாக, setTimeout வழியாக ஒரு பொருள் முறையை அழைப்பது உலகளாவிய சூழலில் வேலை செய்யும். இது தவறான முடிவுகளுக்கு வழிவகுக்கும்.

எடுத்துக்காட்டாக, ஒரு நொடிக்குப் பிறகு user.sayHi() ஐ அழைப்போம்:

செயல்பாடு பயனர் (ஐடி) செயல்பாடு () ( எச்சரிக்கை (இந்த . ஐடி); ); ) var பயனர் = புதிய பயனர்(12345); setTimeout(user.sayHi, 1000 ); // 12345 எதிர்பார்க்கப்படுகிறது, ஆனால் "வரையறுக்கப்படாதது" வெளியிடப்படும்

setTimeout உலகளாவிய சூழலில் user.sayHi செயல்பாட்டை இயக்கும் என்பதால், இதன் மூலம் பொருளை அணுக முடியாது.

வேறு வார்த்தைகளில் கூறுவதானால், டைம்அவுட்டை அமைக்க இந்த இரண்டு அழைப்புகளும் ஒரே காரியத்தைச் செய்கின்றன:

// (1) ஒரு வரி செட் டைம்அவுட் (user.sayHi, 1000 ); // (2) இரண்டு வரிகளில் ஒரே விஷயம் var func = user.sayHi; setTimeout(func, 1000 );

அதிர்ஷ்டவசமாக, ஒரு இடைநிலை செயல்பாட்டை உருவாக்குவதன் மூலம் இந்த சிக்கல் எளிதில் தீர்க்கப்படுகிறது:

செயல்பாடு பயனர் (ஐடி) (இது .ஐடி = ஐடி; இது .சேஹி = செயல்பாடு () (எச்சரிக்கை (இந்த .ஐடி); ) var பயனர் = புதிய பயனர் (12345); setTimeout(function () ( user.sayHi(); ), 1000 );

ஒரு ரேப்பர் செயல்பாடு, வாதங்களை குறுக்கு-உலாவியை அனுப்பவும், செயல்படுத்தும் சூழலைப் பாதுகாக்கவும் பயன்படுகிறது.

மரணதண்டனை ரத்து

setTimeout செயல்பாடு ஒரு டைமர்ஐடியை வழங்குகிறது, இது செயலை ரத்துசெய்யப் பயன்படும்.

தொடரியல்:

ClearTimeout(timeerId)

பின்வரும் எடுத்துக்காட்டில் நாம் காலக்கெடுவை அமைத்து, பின்னர் நீக்குகிறோம் (எங்கள் எண்ணத்தை மாற்றிக்கொண்டோம்). இதன் விளைவாக, எதுவும் நடக்காது.

var timerId = setTimeout(function () ( alert(1) ), 1000 ); clearTimeout(டைமர்ஐடி); இடைவெளியை அமைக்கவும்

setInterval முறையில் setTimeout போன்ற தொடரியல் உள்ளது.

var timerId = setInterval(func/code, தாமதம்[, arg1, arg2...])

வாதங்களின் அர்த்தமும் ஒன்றே. ஆனால், setTimeout போலல்லாமல், இது ஒருமுறை செயல்பாட்டை இயக்காது, ஆனால் குறிப்பிட்ட நேர இடைவெளியில் அதைத் திரும்பத் திரும்பச் செய்கிறது. அழைப்பதன் மூலம் நீங்கள் செயல்படுத்துவதை நிறுத்தலாம்:

தெளிவான இடைவெளி(டைமர்ஐடி)

பின்வரும் உதாரணம், இயக்கும்போது, நீங்கள் நிறுத்து பொத்தானைக் கிளிக் செய்யும் வரை ஒவ்வொரு இரண்டு வினாடிகளுக்கும் ஒரு செய்தியைக் காண்பிக்கும்:

var i = 1 ;

var டைமர் = setInterval(செயல்பாடு () ( எச்சரிக்கை(i++) ), 2000 );

செட்இண்டர்வலில் அழைப்புகளை வரிசைப்படுத்துதல் மற்றும் மேலெழுதுதல்

அழைப்பு setInterval(செயல்பாடு, தாமதம்) குறிப்பிட்ட நேர இடைவெளியில் செயல்பாட்டைச் செயல்படுத்துகிறது. ஆனால் இங்கே ஒரு நுணுக்கம் உள்ளது.

உண்மையில், அழைப்புகளுக்கு இடையிலான இடைநிறுத்தம் குறிப்பிட்ட இடைவெளியை விட குறைவாக உள்ளது.

அதாவது, செயல்பாட்டின் செயல்பாட்டின் நேரத்தை கணக்கில் எடுத்துக் கொள்ளாமல், ஒவ்வொரு 100ms க்கு ஒருமுறை செயலியின் துவக்கத்தை உலாவி தொடங்குகிறது.

ஒரு செயல்பாட்டைச் செயல்படுத்துவது தாமதத்தை விட அதிக நேரம் எடுக்கும். எடுத்துக்காட்டாக, செயல்பாடு சிக்கலானது, ஆனால் தாமதம் சிறியது. அல்லது செயல்பாட்டில் எச்சரிக்கை / உறுதிப்படுத்தல் / உடனடி அறிக்கைகள் உள்ளன, அவை செயல்படுத்தும் நூலைத் தடுக்கின்றன. இங்குதான் விஷயங்கள் சுவாரஸ்யமாகத் தொடங்குகின்றன.

உலாவி பிஸியாக இருப்பதால் ஒரு செயல்பாட்டைத் தொடங்க முடியவில்லை என்றால், உலாவி இலவசம் ஆனதும் அது வரிசைப்படுத்தப்பட்டு செயல்படுத்தப்படும்.

நீண்ட நேரம் செயல்படும் செயல்பாட்டிற்கு என்ன நடக்கிறது என்பதை கீழே உள்ள படம் விளக்குகிறது.

setInterval மூலம் தொடங்கப்பட்ட செயல்பாட்டு அழைப்பு வரிசையில் சேர்க்கப்பட்டது மற்றும் முடிந்தால் உடனடியாக நிகழ்கிறது:

செயல்பாட்டின் இரண்டாவது வெளியீடு முதலில் முடிந்த உடனேயே நிகழ்கிறது:

செயல்படுத்தல் ஒன்றுக்கு மேற்பட்ட முறை வரிசைப்படுத்தப்படவில்லை.

திட்டமிடப்பட்ட பல செயல்படுத்தல்களை விட ஒரு செயல்பாடு செயல்படுத்த அதிக நேரம் எடுத்தால், அது இன்னும் ஒரு முறை வரிசையில் நிற்கும். எனவே ஏவுதல்களின் "திரட்சி" இல்லை.

கீழே உள்ள படத்தில், setInterval செயல்பாட்டை 200ms இல் செயல்படுத்த முயற்சிக்கிறது மற்றும் அழைப்பை வரிசைப்படுத்துகிறது. 300ms மற்றும் 400ms இல் டைமர் மீண்டும் எழுகிறது, ஆனால் எதுவும் நடக்காது.

செட்இண்டர்வல் (செயல்பாடு, தாமதம்) என அழைப்பது, செயல்படுத்தல்களுக்கு இடையே உண்மையான தாமதத்திற்கு உத்தரவாதம் அளிக்காது.

குறிப்பிட்டதை விட உண்மையான தாமதம் அதிகமாகவோ அல்லது குறைவாகவோ இருக்கும் சந்தர்ப்பங்கள் உள்ளன. பொதுவாக, குறைந்தபட்சம் சிறிது தாமதம் ஏற்படும் என்பது உண்மையல்ல.

உள்ளமை செட் டைம்அவுட்டை மீண்டும் செய்கிறது

வழக்கமான மறுமுறை மட்டும் தேவைப்படாமல், ரன்களுக்கு இடையில் தாமதம் தேவைப்படும் சந்தர்ப்பங்களில், ஒவ்வொரு முறை செயல்பாட்டைச் செயல்படுத்தும்போதும் மீண்டும் அமைக்க setTimeout பயன்படுத்தப்படுகிறது.

அவற்றுக்கிடையே 2 வினாடி இடைவெளியில் எச்சரிக்கையை வெளியிடும் உதாரணம் கீழே உள்ளது.

var i = 1 ;

var டைமர் = setTimeout(செயல்பாடு ரன் () (எச்சரிக்கை(i++); டைமர் = setTimeout(ரன், 2000 ); ), 2000 );

செயல்படுத்தும் காலவரிசையானது ரன்களுக்கு இடையே நிலையான தாமதங்களைக் கொண்டிருக்கும். 100ms தாமதத்திற்கான விளக்கம்:

குறைந்தபட்ச டைமர் தாமதம்

உலாவி டைமரில் சாத்தியமான மிகக் குறைந்த தாமதம் உள்ளது. நவீன உலாவிகளில் இது தோராயமாக பூஜ்ஜியத்திலிருந்து 4ms வரை மாறுபடும். பழையவற்றில், இது நீண்டதாகவும் 15 மி.மீ.

தரநிலையின்படி, குறைந்தபட்ச தாமதம் 4ms ஆகும். எனவே setTimeout(..,1) மற்றும் setTimeout(..,4) ஆகியவற்றுக்கு இடையே எந்த வித்தியாசமும் இல்லை.

setTimeout மற்றும் setInterval இன் பூஜ்ஜிய-தாமத நடத்தை உலாவி-குறிப்பிட்டது.

இன்டர்நெட் எக்ஸ்ப்ளோரரில், பூஜ்ஜிய தாமதம் செட்இண்டர்வல்(.., 0) வேலை செய்யாது. இது குறிப்பாக setInterval க்கு பொருந்தும், அதாவது. setTimeout(.., 0) நன்றாக வேலை செய்கிறது.

உண்மையான தூண்டுதல் அதிர்வெண்

சில சமயங்களில் தூண்டுதல் மிகவும் குறைவாக இருக்கலாம், தாமதமானது 4ms ஆக இருக்கலாம், ஆனால் 30ms அல்லது 1000ms ஆகவும் இருக்கலாம்.

பெரும்பாலான உலாவிகள் (டெஸ்க்டாப் முதன்மையாக) தாவல் செயலற்றதாக இருந்தாலும் setTimeout / setInterval ஐ தொடர்ந்து இயக்கும். அதே நேரத்தில், அவற்றில் பல (Chrome, FF, IE10) குறைந்தபட்ச டைமர் அதிர்வெண்ணை வினாடிக்கு 1 முறை குறைக்கிறது. டைமர் "பின்னணி" தாவலில் வேலை செய்யும் என்று மாறிவிடும், ஆனால் அரிதாக.

பேட்டரி சக்தியில் இயங்கும் போது, மடிக்கணினியில், உலாவிகள் அடிக்கடி குறியீட்டை இயக்க அதிர்வெண்ணைக் குறைக்கலாம் மற்றும் பேட்டரி சக்தியைச் சேமிக்கலாம். குறிப்பாக IE இதற்கு பிரபலமானது. அமைப்புகளைப் பொறுத்து, குறைப்பு பல முறை அடையலாம். CPU சுமை அதிகமாக இருந்தால், JavaScript ஆனது டைமர்களை சரியான நேரத்தில் செயல்படுத்த முடியாமல் போகலாம். இது சில செட்இண்டர்வல் ரன்களைத் தவிர்க்கும்.

முடிவு: 4ms அதிர்வெண் கவனம் செலுத்துவது மதிப்பு, ஆனால் நீங்கள் அதை எண்ணக்கூடாது.

கன்சோலுக்கான இடைவெளிகளை வெளியிடுதல் அழைப்புகளுக்கு இடையேயான நேர இடைவெளியைக் கணக்கிடும் குறியீடு இதுபோல் தெரிகிறது:

var timeMark = புதிய தேதி; setTimeout(function go () ( var diff = புதிய தேதி - timemark; // பக்க கன்சோலுக்கு பதிலாக கன்சோலில் அடுத்த தாமதத்தை அச்சிடவும் .log(diff); // நேரத்தை மிக இறுதியில் நினைவில் வைத்துக்கொள்ளவும், // அழைப்புகளுக்கு இடையே தாமதம் டைம்மார்க் = புதிய தேதி (செட், 100), 100 ; தந்திரம் டைம்அவுட் (func, 0) அமைக்கப்பட்டுள்ளது

இந்த தந்திரம் ஜாவாஸ்கிரிப்ட் ஹேக்குகளின் ஆண்டுகளை உள்ளிடுவதற்கு தகுதியானது.

தற்போதைய ஸ்கிரிப்ட் முடிந்த பிறகு நீங்கள் அதை இயக்க விரும்பினால், செயல்பாடு setTimeout (func, 0) இல் மூடப்பட்டிருக்கும்.

விஷயம் என்னவென்றால், setTimeout செயல்பாட்டை உடனடியாக செயல்படுத்தாது. அவர் அதை செயல்படுத்த மட்டுமே திட்டமிடுகிறார். ஆனால் ஜாவாஸ்கிரிப்ட் மொழிபெயர்ப்பாளர் தற்போதைய ஸ்கிரிப்ட் செயல்படுத்தப்பட்ட பின்னரே திட்டமிட்ட செயல்பாடுகளைச் செய்யத் தொடங்கும்.

ஸ்டாண்டர்ட் படி, setTimeout எப்படியும் 0 தாமதத்துடன் ஒரு செயல்பாட்டை இயக்க முடியாது, நாங்கள் முன்பு கூறியது போல், தாமதம் பொதுவாக 4ms ஆக இருக்கும். ஆனால் இங்கே முக்கிய விஷயம் என்னவென்றால், எந்தவொரு சந்தர்ப்பத்திலும் செயல்படுத்துவது தற்போதைய குறியீட்டை செயல்படுத்திய பிறகு நடைபெறும்.

உதாரணமாக:

var முடிவு; செயல்பாடு showResult () ( எச்சரிக்கை(முடிவு); ) setTimeout(showResult, 0 ); முடிவு = 2 *2 ; // மொத்தம் 4 ஐ வெளியிடும்

setInterval(func, தாமதம்) மற்றும் setTimeout(func, தாமதம்) முறைகள், ஒவ்வொரு தாமதம் மில்லி விநாடிகளுக்கு ஒருமுறை, நீங்கள் அடிக்கடி func ஐ இயக்க அனுமதிக்கின்றன.

இரண்டு முறைகளும் டைமர் ஐடியை வழங்கும். இது clearInterval / clearTimeout ஐ அழைப்பதன் மூலம் செயல்படுத்தலை நிறுத்த பயன்படுகிறது.

| | இடைவெளி | செட் டைம்அவுட் | || ----------- | ---------- | | நேரம் | அழைப்பு கண்டிப்பாக டைமரில் உள்ளது. மொழிபெயர்ப்பாளர் பிஸியாக இருந்தால், ஒரு அழைப்பு வரிசையில் இருக்கும். செயல்பாடு செயல்படுத்தும் நேரம் கணக்கில் எடுத்துக்கொள்ளப்படுவதில்லை, எனவே ஒரு ஓட்டத்தின் முடிவில் இருந்து மற்றொன்று தொடங்கும் நேர இடைவெளி மாறுபடலாம். | செட்இன்டெர்வலுக்குப் பதிலாக setTimeoutக்கான சுழல்நிலை அழைப்பு பயன்படுத்தப்படுகிறது, அங்கு செயல்படுத்தல்களுக்கு இடையே ஒரு நிலையான இடைநிறுத்தம் தேவைப்படுகிறது. | | தாமதம் | குறைந்தபட்ச தாமதம்: 4 மி. | குறைந்தபட்ச தாமதம்: 4 மி. | | உலாவி அம்சங்கள் | IE இல் தாமதம் 0 வேலை செய்யாது ஓபராவில், பூஜ்ஜிய தாமதமானது 4msக்கு சமம், மற்றும் பிற தாமதங்கள் துல்லியமாக கையாளப்படும், தரமற்ற 1ms, 2ms மற்றும் 3ms உட்பட. |

ஆசிரியர் தேர்வு