编写自己的工具箱 (一)
生活随笔
收集整理的這篇文章主要介紹了
编写自己的工具箱 (一)
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
仔細想了一下 決定先解決一下調用的問題, 這樣無比要解決異步獲取
?
!function(){var requireOption = window.requireOption || {path : '',};var windowIsLoad = false;var key = setInterval(function(){if( document.body || windowIsLoad ){windowIsLoad = true;clearInterval(key);this.onlad = null;key = null;requireFunctionRun();}},500)/*window.onload = function(){if( windowIsLoad ) return;windowIsLoad = true;requireFunctionRun();this.onload = null;clearInterval(key);}*///保存所有的已經加載完成的require方法 等待頁面網頁加載完成執行var requireFunction = [];var requireFunctionRun = function(){for(;requireFunction.length > 0;){requireFunction.shift()(); }}var defineName = '';var responseText = '';var require = function(name,callback){callback || (callback = function(){ return arguments.length == 1 ? arguments[0] : Array.prototype.slice.apply(arguments); });var path = requireOption.path,argu = [],key = false,length = name.length;name.forEach(function(e,i,ar){if(e.indexOf(".js") < 0){ar[i] += ".js";}})if( name.length > 0 ){for( var i = 0 ; i < name.length ; i++ ){if( typeof defineData.get(name[i]) === 'undefined' ){if( !defineData.time[name[i]] )defineData.time[name[i]] = {};defineData.time[name[i]].start = new Date();require.ajax({type: 'get',url : requireOption.path + name[i],success: function(name,e){try{defineName = name.toString();responseText = e.currentTarget.responseText; if( responseText ){if( responseText.indexOf("/*lwz-define-js*/") > -1|| responseText.indexOf('define') < 0 ){eval( "Lwz.define([],'文件不符合AMD格式,作為js獨立運行中')");responseText = "/*" + defineName + "*/\n" + responseText;eval( responseText);}else{responseText = responseText.replace("define",'Lwz.define')responseText = "/*" + defineName + "*/\n" + responseText;eval( responseText );}responseText = null;}else eval( "Lwz.define([],null)"); }catch(e){console.log(name+"文件執行錯誤")console.log("錯誤原因:"+e.stack)responseText = null;}}.bind(this,name[i]),error: function(name,e){defineName = name.toString() //.split('/').pop()eval( "Lwz.define([],'加載失敗')");console.log(name+"文件加載失敗")debugger;console.log("失敗原因:"+e.currentTarget.responseText);}.bind(this,name[i]),});defineData.setLoading(name[i]);}defineData.get(name[i],function(data,n){argu[name.indexOf(n)] = data;if( --length == 0 ){windowIsLoad ? callback.apply(window,argu) : requireFunction.push(callback.bind(window,argu))}})}} else{callback.apply(this,argu)} ;}var getXML = function(){if( XMLHttpRequest )return new XMLHttpRequest();elsereturn new ActiveXObject("Microsoft.XMLHTTP");}require.XMLHttp = getXML();require.option = requireOption;require.ajax = function(option = {}){var url = option.url;if( !url ) return;var mothed = option.type || "get";var data = "";for( var i in option.data )data += i + "=" + option.data[i] + "&";var success = option.success;var error = option.error;var complete = option.complete;var ajax = getXML();//判斷是否是post請求if( mothed === "post" ){//如果是則添加頭部文件ajax.setRequestHeader("Content-type","application/x-www-form-urlencoded");}else{url += "?" + data; data = undefined;}//建立請求連接ajax.open(mothed,url);//發送請求ajax.send(data);//請求回調ajax.onreadystatechange = function(e){if( this.readyState == 4 ){if( this.readyState == 4 && this.status == 200 )success.apply(this,arguments);else if( this.readyState == 4 && this.status.toString()[0] != "2" )error.apply(this,arguments);complete && complete.apply(this,arguments);}}}var define = function(){var argLen = arguments.length,name = arguments[0],depend = arguments[1],object1 = arguments[2],notArgu = [],argu = [];try{//判斷是否給模塊命名if( typeof name !== 'string' ){object1 = depend;depend = name;name = defineName;}//如果存在依賴模塊的話if( typeof depend === 'object'&& typeof depend.length == 'number'&& depend.constructor === Array) {depend.forEach(function(e,i,ar){if(e.indexOf(".js") < 0){ar[i] += ".js";}})//先判斷依賴模塊是否已經被加載了for( var i = 0; i < depend.length ; i ++ ){if(typeof defineData.get(depend[i]) === 'undefined'|| defineData.get(depend[i]) === null){//如果存在沒有被加載的模塊notArgu.push(depend[i]);}else{argu[i] || ( argu[i] = defineData.get(depend[i]) );}}if( notArgu.length > 0 ){//進入加載模塊//并在加載成功后重新運行函數require(notArgu,define.bind(this,name,depend||[],object1));return ;}}else {object1 = depend;depend = undefined;}}catch(e){console.error(name+"文件加載錯誤;")console.error(e);}//不存在未被加載的依賴模塊if( typeof object1 === 'function' ){defineData.set(name,object1.apply(this,argu)); }else{defineData.set(name,object1);}}var defineData = {time : {},data : {},get : function( name , callback ){name.indexOf(".js") < 0 && ( name+='.js' );var data = this.data[name];if( !callback ) return data;if( data ){callback.call(this,data,name);return data; }else{this.waitLoad[name] || (this.waitLoad[name] = []);this.waitLoad[name].push(callback);}},set : function( name , data ){this.data[name] = data;console.log(name+'注冊成功。')this.time[name].end = new Date();this.time[name].time = this.time[name].start - this.time[name].end;var waitFunction = this.waitLoad[name];for( ;; ){if( waitFunction.length < 1 ) break;waitFunction.shift()(data,name);}},setLoading : function(name){this.data[name] = null;},waitLoad : {}};window.Lwz = {data : defineData,require : require,define : define};}()
?
先自定義一個異步獲取的結構, 這樣確定了以后我的工具箱加載的方式
采用傳統的? require加載 define注冊的方式? 有利于第三方直接拿過去使用。。 考慮到以后可能會被直接才分使用
我不太會說話? 所以我的博客一般都是直接上代碼的, 注釋什么的還是有的, 認真看的話 應該還是沒什么問題的, 代碼秉承著怎么簡單怎么寫的原則 ,可讀性 應該還行吧------大佬別打我。
?
轉載于:https://www.cnblogs.com/liao1992/articles/9337143.html
總結
以上是生活随笔為你收集整理的编写自己的工具箱 (一)的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: chrome 浏览器全屏操作
- 下一篇: java(IO)读写文件乱码转换UTF-