js ajax惰性載入程式碼例項
本章節介紹介紹一下ajax多性載入的用法,當然它是具有一定優勢的。
在js中有些記憶體只需執行一遍即可,如瀏覽器型別檢測是最常用的一個功能,因為我們使用Ajax的時候需要檢測瀏覽器的內建的XHR。我們可以在第一次檢測的時候記錄下型別,往後在使用Ajax的時候就不需要再去檢測瀏覽器型別了。在js中就算只有一個if也總比沒有if的語句效率要高。
程式碼例項:
例項一:
普通的ajax程式碼
[JavaScript] 純文字檢視 複製程式碼function ajax(){ if(typeof XMLHttpRequest != "undefined"){ return new XMLHttpRequest(); } else if(typeof ActiveXObject != "undefined"){ if(typeof arguments.callee.activeXString != "string"){ var versions = ["MSXML2.XMLHttp.6.0","MSXML2.XMLHttp.3.0","MSXML2.XMLHttp"]; for(var index=0,k=version.length;index<k;index++){ try{ new ActiveXObject(versions[index]); arguments.callee.activeXString = versions[index]; break; } catch(ex){ throw ex; } } } return new ActiveXObject(arguments.callee.activeXString); } else{ throw "No XHR object"; } }
每次呼叫ajax()函式都要對瀏覽器內建的XHR檢查,效率不高。
例項二:
惰性方式的程式碼
[JavaScript] 純文字檢視 複製程式碼function ajax(){ if(typeof XMLHttpRequest != "undefined"){ ajax = function(){ return new XMLHttpRequest(); }; } else if(typeof ActiveXObject != "undefined"){ ajax = function(){ if(typeof arguments.callee.activeXString != "string"){ var versions = ["MSXML2.XMLHttp.6.0","MSXML2.XMLHttp.3.0","MSXML2.XMLHttp"]; for(var index=0,k=version.length;index<k;index++){ try{ var xhr = new ActiveXObject(versions[index]); arguments.callee.activeXString = versions[index]; return xhr; } catch(ex){ throw ex; } } } return new ActiveXObject(arguments.callee.activeXString); } } else{ ajax = function(){ throw "No XHR object"; } } return ajax(); }
惰性方法中if的每個分支都會為ajax()變數賦值,有效覆蓋了原有函式,最後一步呼叫新的函式。下一次呼叫的ajax()的時候,就直接呼叫變數。
相關文章
- js圖片緩衝載入程式碼例項JS
- ajax請求完畢之前顯示正在載入程式碼例項
- ajax載入xml檔案內容程式碼例項簡單介紹XML
- canvas載入效果程式碼例項Canvas
- 動態載入js或者css檔案程式碼例項JSCSS
- 實現js檔案動態載入程式碼例項JS
- 原生ajax處理json格式資料程式碼例項JSON
- js四捨五入程式碼例項JS
- 動態載入javascript指令碼程式碼例項JavaScript指令碼
- jQuery ajax請求程式碼例項分享jQuery
- js下拉滾動條瀑布流載入資料程式碼例項JS
- javascript圖片預載入程式碼例項JavaScript
- jQuery載入進度條例項程式碼jQuery
- CSS載入遠端字型例項程式碼CSS
- 原生js實現的動態載入css和js檔案程式碼例項JSCSS
- 利用函式的惰性載入提高 javascript 程式碼效能函式JavaScript
- js刮刮樂程式碼例項JS
- toJSON()程式碼例項JSON
- 使用ajax方式提交表單程式碼例項
- 原生ajax()函式封裝程式碼例項函式封裝
- jQuery實現的動態載入css和js檔案程式碼例項 [jQueryCSSJS
- js實現圓環百分比載入等待效果程式碼例項JS
- PHP+Ajax點選載入更多列表資料例項PHP
- js使用XMLHttpRequest例項程式碼JSXMLHTTP
- js confirm()程式碼例項JS
- 原生javascript對ajax的封裝程式碼例項JavaScript封裝
- js將表格匯入到Execel表例項程式碼JS
- javascript動態載入css檔案程式碼例項JavaScriptCSS
- jquery圖片預載入簡單程式碼例項jQuery
- jQuery實現圖片預載入程式碼例項jQuery
- js監聽鍵盤事件程式碼例項例項JS事件
- jQuery的ajax和json使用例項jQueryJSON
- Angular 中使用惰性載入Angular
- JavaScript 函式惰性載入JavaScript函式
- ajax實現的無重新整理使用者登入例項程式碼
- js選項卡簡單程式碼例項JS
- 原生js tab選項卡程式碼例項JS
- ajax讀取資料庫資料程式碼例項資料庫