一些很實用util工具函式
1、生成UUID。
儘管前端已有Symbol,但這更多是在於確保物件的屬性唯一,不過有時候也會用到關於生成ID的場景。
const createUUID = () => new Date().getTime().toString(32) + Math.floor(Math.random() * 999999).toString(32);
2、手動實現一個jsonp。
在當下的情況中,解決跨域問題越來越趨向於代理,實際上jsonp也是另一種解決辦法,僅僅將XHR請求變成非XHR請求(即script)。
class dorseyJsonp {
constructor (url, callback) {
let id = this.createRandomId();
window[id] = function (result) {
if(callback){
callback(result);
}
let scriptID = document.querySelector('#' + id);
scriptID.parentNode.removeChild(scriptID);
window[scriptID] = null;
}
let script = document.createElement('script');
script.src = url;
script.id = id;
script.type = 'text/javascript';
document.body.appendChild(script);
}
createRandomId () {
return 'query' + Math.floor(Math.random() * 10000).toString(32) + new Date().getTime().toString(32);
}
}
3、將URL的引數轉化成一個物件。
如:
如輸入:http://www.baidu.com/item.html#hello?pageNo=1&pageSize=30&keyword=hello
輸出:{
pageNo: '1',
pageSize: '30',
keyword: 'hello'
}
看看工具函式:
const getUrlParams = url => {
let arr = url.match(/(?<=[?&]).*?(?=(&|$))/g),
res = {};
arr && arr.length && arr.map(item => res[item.split('=')[0]] = item.split('=')[1]);
return res;
}
console.log(getUrlParams(''));
console.log(getUrlParams(''));
4、日期格式化。
在實際應用的過程中,可能最常見的日期格式就是’2019-11-30 09:00:00’這樣的格式了,但JavaScript中似乎沒有,所以需要我們自己實現。
const fill = num => num >= 10 ? num : ('0' + num);
const format = (date, formatStr) => {
return formatStr.replace('yyyy', date.getFullYear())
.replace('MM', fill(date.getMonth() + 1))
.replace('dd', fill(date.getDate()))
.replace('HH', fill(date.getHours()))
.replace('mm', fill(date.getMinutes()))
.replace('ss', fill(date.getSeconds()));
}
console.log(format(new Date(), 'yyyy年MM月dd日 HH時mm分ss秒'));
return format(new Date(), 'yyyy-MM-dd HH:mm:ss');
5、圖片字首替換
實際應用中,無論是網站,app也好,大型複雜系統也罷,圖片資源一般都儲存在專門最佳化過的ftp伺服器,而資料庫中儲存的實際上僅僅是一串URL,在業務的變遷過程中,有時候會涉及到資源遷移,這樣一般情況下,資料庫的圖片不會儲存IP跟埠或域名,有些設計之初儲存了,則需要我們自行替換。
const changeIPAndPort = pic => pic.replace(/*:d+//g, 'https:172.22.20.25:8080')
來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/2144/viewspace-2824363/,如需轉載,請註明出處,否則將追究法律責任。
相關文章
- 用表函式實現OTOP 工具函式
- 輸出EXCEL檔案的通用函式,很實用 (轉)Excel函式
- 函式式工具函式
- 前端簡潔並實用的工具類函式封裝前端函式封裝
- jdbc Util 工具類JDBC
- TypeScript魔法堂:函式型別宣告其實很複雜TypeScript函式型別
- gookit/goutil - Go一些常用的工具函式實現、增強、收集和整理Go函式
- 實用函式式 Java (PFJ)簡介函式Java
- ORACLE 實用函式總結Oracle函式
- php的一些函式PHP函式
- 一些有用的函式函式
- 關於字元函式的一些應用總結字元函式
- Flutter Flame教程11 -- Util 工具Flutter
- 介紹幾個程式碼實際開發中很實用的工具
- [譯] 編寫函式式的 JavaScript 實用指南函式JavaScript
- 【iOS開發】初識函式式Swift實用iOS函式Swift
- (函式)實現strstr函式函式
- 損失函式+啟用函式函式
- 一些簡單的函式函式
- oracle的一些函式(一)Oracle函式
- 用匯編實現add函式函式
- 超實用PHP函式總結整理PHP函式
- linuxrinetd、socat埠轉發部署(很實用的網路工具)Linux
- 用Map+函式式介面來實現策略模式函式模式
- 很實用的話:70%定律
- JavaScript 工具函式大全(新)JavaScript函式
- pycuda-一些計算函式函式
- 專案裡的一些小函式函式
- js中函式的一些”坑“JS函式
- Jquery庫的一些可用函式jQuery函式
- MySQL 日期函式、時間函式在實際場景中的應用MySql函式
- 鴻蒙HarmonyOS實戰-Web元件(前端函式和應用側函式相互呼叫)鴻蒙Web元件前端函式
- 實現一些字串操作標準庫函式、解決一些字串問題字串函式
- 用ORACLE分析函式實現行列轉換Oracle函式
- 實用Common Lisp程式設計——函式Lisp程式設計函式
- gethostbyname函式和getservbyname函式的應用函式
- 不會用“函式選項模式”的朋友看過來,這麼寫很優雅函式模式
- 函式實操函式