Pendikitan JavaScript ialah teknik berguna yang boleh menghalang fungsi daripada dilaksanakan terlalu kerap. Ini boleh memberi manfaat terutamanya dalam situasi di mana panggilan fungsi yang berlebihan boleh menyebabkan isu prestasi atau kesan yang tidak diingini.
Kod JavaScript berikut menyediakan fungsi "pendikit" yang boleh digunakan semula:
<code class="javascript">function throttle(fn, threshhold, scope) { threshhold || (threshhold = 250); var last, deferTimer; return function () { var context = scope || this; var now = +new Date, args = arguments; if (last && now < last + threshhold) { // hold on to it clearTimeout(deferTimer); deferTimer = setTimeout(function () { last = now; fn.apply(context, args); }, threshhold); } else { last = now; fn.apply(context, args); } }; }
Walau bagaimanapun, fungsi yang disediakan mempunyai kelemahan yang ketara. Selepas masa pendikit telah berlalu, ia menghidupkan fungsi sekali lagi. Ini boleh membawa kepada tingkah laku yang tidak diingini dalam senario tertentu.
Versi semakan fungsi pendikit tersedia daripada perpustakaan seperti underscore.js dan lodash. Versi ini berkesan menangani isu menyalakan fungsi selepas masa pendikit:
<code class="javascript">function throttle(func, wait, options) { var context, args, result; var timeout = null; var previous = 0; if (!options) options = {}; var later = function() { previous = options.leading === false ? 0 : Date.now(); timeout = null; result = func.apply(context, args); if (!timeout) context = args = null; }; return function() { var now = Date.now(); if (!previous && options.leading === false) previous = now; var remaining = wait - (now - previous); context = this; args = arguments; if (remaining <= 0 || remaining > wait) { if (timeout) { clearTimeout(timeout); timeout = null; } previous = now; result = func.apply(context, args); if (!timeout) context = args = null; } else if (!timeout && options.trailing !== false) { timeout = setTimeout(later, remaining); } return result; }; };</code>
Versi fungsi pendikit yang dipermudahkan dan tidak boleh dikonfigurasikan disediakan di bawah:
<code class="javascript">function throttle (callback, limit) { var waiting = false; // Initially, we're not waiting return function () { // We return a throttled function if (!waiting) { // If we're not waiting callback.apply(this, arguments); // Execute users function waiting = true; // Prevent future invocations setTimeout(function () { // After a period of time waiting = false; // And allow future invocations }, limit); } } }</code>
Dengan fungsi ini, anda boleh mengawal kekerapan pelaksanaan fungsi dengan melaraskan parameter "had".
Atas ialah kandungan terperinci ## Mengapakah Fungsi Pendikit JavaScript Kadangkala Menyala Sekali Lagi Selepas Masa Pendikit Telah Berlalu?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!