摘要:生成隨機(jī)生成一個(gè)唯一的這個(gè)方法用于生成一個(gè)隨機(jī),可以將生成的視為全局唯一的生成兩個(gè)相同的情況很少。似乎在前端用的比較少,目前項(xiàng)目用到就是在每次請(qǐng)求后端接口時(shí)調(diào)用此方法,生成一個(gè)傳過去。
前言
以下代碼來自:自己寫的、工作項(xiàng)目框架上用到的、其他框架源碼上的、網(wǎng)上看到的。
主要是作為工具函數(shù),服務(wù)于框架業(yè)務(wù),自身不依賴于其他框架類庫,部分使用到es6/es7的語法使用時(shí)要注意轉(zhuǎn)碼
雖然盡量在函數(shù)中做了錯(cuò)誤情況的處理,仍有可能出現(xiàn)報(bào)錯(cuò)的情況(不定期完善)
/** *獲取url上的參數(shù) * @return {object} * @example * getRequest() getRequest().paramA */ function getRequest() { var searchString = window.location.search.substring(1), params = searchString.split("&"), hash = {}; if (searchString == "") return {}; for (var i = 0; i < params.length; i++) { var pos = params[i].indexOf("="); if (pos == -1) { continue; } var paraName = params[i].substring(0, pos), paraValue = params[i].substring(pos + 1); hash[paraName] = paraValue; } return hash; }
?返回一個(gè)對(duì)象,將url上的參數(shù)以鍵值對(duì)的形式存儲(chǔ)在返回結(jié)果中,如果url上沒參數(shù),則返回空對(duì)象
/** * 計(jì)算兩個(gè)日期時(shí)間的時(shí)間差 * @param {Date, Date} date1 date2 * @return {object | null} * @example * getDiff(new Date("2017-09-08"), new Date()) */ function getDiff(date1, date2) { if (!date1.getTime || !date2.getTime) return null var ms = (date1.getTime() - date2.getTime()); var day1 = Math.round(ms / 24 / 3600 / 1000), hh1 = Math.round((ms / 3600 / 1000) % 24), mm1 = Math.round((ms / 1000 / 60) % 60), ss1 = Math.round((ms / 1000) % 60); return { day: day1, hour: hh1, minute: mm1, second: ss1 }; }
?傳入兩個(gè)Date日期對(duì)象,返回一個(gè)對(duì)象,其屬性值day、hour、minute、second分別表示相差天數(shù)、小時(shí)、分鐘、秒。結(jié)果以Math.round()取整,如果結(jié)果為負(fù),則表示第一個(gè)日期在第二個(gè)日期前面
/** * 將canvas轉(zhuǎn)化為image格式 * @param {string} cId * @return {object HTMLImageElement} * @example * canvasToImg("canvas") canvasToImg("#canvarsId") */ function canvasToImg(cId){ let canvas = document.querySelector(cId) if (!canvas || !canvas.toDataURL) return new Image() let imgData = canvas.toDataURL("image/png"), imgs= new Image(); imgs.src=imgData; return imgs }
?傳入一個(gè)css選擇器,函數(shù)根據(jù)選擇器查詢canvas節(jié)點(diǎn),然后返回該canvas的image格式節(jié)點(diǎn),如果查找不到則返回一個(gè)空的image。原理是將canvas轉(zhuǎn)化為base64編碼,toDataURL方法貌似是canvas節(jié)點(diǎn)獨(dú)有的,然后新建一個(gè)src是這個(gè)base64編碼的圖片。
?ps:什么情況下需要做這種轉(zhuǎn)換呢?目前我知道的一個(gè)就是canvas在移動(dòng)端無法長按保存到手機(jī)。
/** * 生成一個(gè)唯一的guid * @return {string} * @example * // 7f603b20-17ff-4f47-aeb9-e7996de04939 * util.guid(); * @see http://stackoverflow.com/questions/105034/create-guid-uuid-in-javascript */ function guid () { return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function(c) { var r = Math.random()*16|0, v = c == "x" ? r : (r&0x3|0x8); return v.toString(16); }); }
?這個(gè)方法用于生成一個(gè)隨機(jī)guid,可以將生成的guid視為全局唯一的(生成兩個(gè)相同id的情況很少)。guid似乎在前端用的比較少,目前項(xiàng)目用到就是在每次請(qǐng)求后端接口時(shí)調(diào)用此方法,生成一個(gè)guid傳過去。
function isLeapYear (year) { if (year % 100 === 0) { if (year % 400 === 0) { return true; } } else if (year % 4 === 0) { return true; } return false; } /** * 獲取某個(gè)月份有多少天 * @return {number} * @param {string | number} year month * @example * getDaysInMonth(2017, 9) */ function getDaysInMonth (year, month) { return [31, isLeapYear(year) ? 29 : 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31][month]; }
?傳入一個(gè)年份和月份,返回該月有多少天,其中也包含了一個(gè)isLeapYear方法來判斷是否是閏年,應(yīng)該在實(shí)現(xiàn)日歷或者日期選擇組件時(shí)用的到
結(jié)語?暫時(shí)就寫這么多了,后面不定期補(bǔ)充。
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/51259.html
摘要:生成隨機(jī)生成一個(gè)唯一的這個(gè)方法用于生成一個(gè)隨機(jī),可以將生成的視為全局唯一的生成兩個(gè)相同的情況很少。似乎在前端用的比較少,目前項(xiàng)目用到就是在每次請(qǐng)求后端接口時(shí)調(diào)用此方法,生成一個(gè)傳過去。 前言 以下代碼來自:自己寫的、工作項(xiàng)目框架上用到的、其他框架源碼上的、網(wǎng)上看到的。 主要是作為工具函數(shù),服務(wù)于框架業(yè)務(wù),自身不依賴于其他框架類庫,部分使用到es6/es7的語法使用時(shí)要注意轉(zhuǎn)碼 雖然盡...
摘要:導(dǎo)航組件使用詳解注意了,如果有小伙伴們發(fā)現(xiàn)運(yùn)行作者提供的示例項(xiàng)目報(bào)如下的錯(cuò)誤,可能是大家使用了命令導(dǎo)致的,解決這個(gè)錯(cuò)誤的辦法就是將刪除,然后重新使用命令來安裝,最后使用來起服務(wù),應(yīng)該就不報(bào)錯(cuò)了。 react-navigation導(dǎo)航組件使用詳解 注意了,如果有小伙伴們發(fā)現(xiàn)運(yùn)行作者提供的react-navigation示例項(xiàng)目報(bào)如下的錯(cuò)誤,可能是大家使用了 yarn install 命...
摘要:最近關(guān)注的重學(xué)前端系列文章,也想把已知的前端知識(shí)體系梳理一遍,夯實(shí)基礎(chǔ)的同時(shí),總結(jié)提升。標(biāo)準(zhǔn)模式的排版和運(yùn)作模式都是以該瀏覽器支持的最高標(biāo)準(zhǔn)運(yùn)行。模式是目前最常用的模式。嚴(yán)格模式不允許展示型棄用元素和框架集。中空格不會(huì)被自動(dòng)刪除。 最近關(guān)注winter的重學(xué)前端系列文章,也想把已知的前端知識(shí)體系梳理一遍,夯實(shí)基礎(chǔ)的同時(shí),總結(jié)提升。接下來會(huì)從HTML、CSS、JS、性能、網(wǎng)絡(luò)安全、框架通...
閱讀 3855·2021-09-29 09:34
閱讀 3786·2021-09-27 13:34
閱讀 580·2021-09-24 09:47
閱讀 3045·2019-08-30 15:53
閱讀 1821·2019-08-26 13:54
閱讀 2096·2019-08-26 13:43
閱讀 545·2019-08-23 14:47
閱讀 1752·2019-08-23 14:28