這篇文章主要給大家匯總介紹了javascript最基本的7個(gè)函數(shù)，十分的實(shí)用，有需要的小伙伴可以參考下。
我記得早期的 JavaScript ，要完成任何事情幾乎都繞不開一些簡單的函數(shù)，因?yàn)?u>瀏覽器提供商實(shí)現(xiàn)功能有所差異，而且不只是邊緣功能，基礎(chǔ)功能也一樣，如 addEventListener 和 attachEvent。雖然時(shí)代變了，但仍有一些函數(shù)是每個(gè)開發(fā)者都應(yīng)該掌握的，以便于完成某些功能和提高性能。
debounce
對于高耗能事件，debounce 函數(shù)是一種不錯(cuò)解決方案。如果你不對 scroll、resize、和 key* 事件使用 debounce 函數(shù)，那么你幾乎等同于犯了錯(cuò)誤。下面的 debounce 函數(shù)能讓你的代碼保持高效：
?
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 // 返回一個(gè)函數(shù)，如果它被不間斷地調(diào)用，它將不會得到執(zhí)行。該函數(shù)在停止調(diào)用 N 毫秒后，再次調(diào)用它才會得到執(zhí)行。如果有傳遞 ‘immediate' 參數(shù)，會馬上將函數(shù)安排到執(zhí)行隊(duì)列中，而不會延遲。 function debounce(func, wait, immediate) { var timeout; return function() { var context = this, args = arguments; var later = function() { timeout = null; if (!immediate) func.apply(context, args); }; var callNow = immediate && !timeout; clearTimeout(timeout); timeout = setTimeout(later, wait); if (callNow) func.apply(context, args); }; }; // 用法 var myEfficientFn = debounce(function() { // 所有繁重的操作 }, 250); window.addEventListener('resize', myEfficientFn);debounce 函數(shù)不允許回調(diào)函數(shù)在指定時(shí)間內(nèi)執(zhí)行多于一次。當(dāng)為一個(gè)會頻繁觸發(fā)的事件分配一個(gè)回調(diào)函數(shù)時(shí)，該函數(shù)顯得尤為重要。
poll
盡管上面我提及了 debounce 函數(shù)，但如果事件不存在時(shí)，你就不能插入一個(gè)事件以判斷所需的狀態(tài)，那么就需要每隔一段時(shí)間去檢查狀態(tài)是否達(dá)到你的要求。
?
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 function poll(fn, callback, errback, timeout, interval) { var endTime = Number(new Date()) + (timeout || 2000); interval = interval || 100; (function p() { // 如果條件滿足，則執(zhí)行！ if(fn()) { callback(); } // 如果條件不滿足，但并未超時(shí)，再來一次 else if (Number(new Date()) < endTime) { setTimeout(p, interval); } // 不匹配且時(shí)間消耗過長，則拒絕！ else { errback(new Error('timed out for ' + fn + ': ' + arguments)); } })(); } // 用法：確保元素可見 poll( function() { return document.getElementById('lightbox').offsetWidth > 0; }, function() { // 執(zhí)行，成功的回調(diào)函數(shù) }, function() { // 錯(cuò)誤，失敗的回調(diào)函數(shù) } );新聞熱點(diǎn)
疑難解答
圖片精選
