摘要:前端業(yè)務代碼工具庫不定時更新目的高效率完成前端業(yè)務代碼業(yè)務開發(fā)過程中,會經常用到擴展方法瀏覽器類型判斷表單驗證常用方法等常用函數,為避免不同項目多次復制粘貼的麻煩,這里統(tǒng)一封裝,并發(fā)布到,以提高開發(fā)效率。
utilscoreJS
前端業(yè)務代碼工具庫(不定時更新)
目的:高效率完成前端業(yè)務代碼
業(yè)務開發(fā)過程中,會經常用到String,Number,Array,Object,Function,Date擴展方法、瀏覽器類型判斷、base64、表單驗證、url常用方法等常用函數,為避免不同項目多次復制粘貼的麻煩,這里統(tǒng)一封裝,并發(fā)布到npm,以提高開發(fā)效率。如果你也有常用的代碼,歡迎為本項目提交pr.
安裝使用直接下載dist目錄下的index.js使用,支持UMD,CMD,AMD各模塊化規(guī)范。
使用npm/yarn/cnpm安裝。
瀏覽器:npm
$ npm i utilscoreyarn
$ yarn add utilscorecnpm
$ cnpm i utilscore
React、VueJS,小程序等javascript環(huán)境
// 完整引入 import utilscore from "utilscore" let txt = utilscore.mask("12398765432",3,7) console.log(txt) // => "123****5432"
推薦使用方法
你真的不需要完整引入所有函數,所以只引入需要使用的方法即可。
import { mask } from "utilscore" let txt = mask("12398765432",3,7) console.log(txt) // => "123****5432"API文檔
Object
deepClone 深度克隆。
orderBy 返回按屬性(props)和順序(orders)排序的對象數組,用于數據排序。
findPathByLeafId 根據 key 遞歸查找鏈帶關系。
Array
uniqueBy 根據屬性去重數組。
unique 普通數組去重。
maxNumBy 找出數組中該屬性最大值的一列。
minNumBy 找出數組中該屬性最小值的一列。
maxNum 數組中的最大值。
mixNum 數組中的最小值。
Date
formatTime 格式化時間。
formatHMS 將秒數轉為 xx小時xx分鐘xx秒 例如1h0m10s。
Function
debounceStart 函數防抖 (立即執(zhí)行版)。
debounceEnd 函數防抖 (非立即執(zhí)行版)。
debounce 函數防抖 (完全版)。
throttle 函數節(jié)流
String
mask 根據位置,使用 * 遮蔽字符串。
maskLeft 從位置左邊開始,使用 * 遮蔽字符串。
maskRight 從位置右邊開始,使用 * 遮蔽字符串。
randomHexColorCode 生成一個隨機的十六進制顏色代碼。
getCounts 返回元素出現的次數。
uuid 全局唯一標識符 UUID
guid GUID:128位的數字標識符
Number
randomNum 返回指定范圍內的隨機整數。
round 將數字四舍五入到指定的小數位數。
sum 返回兩個或兩個以上數字/數字數組中元素之和。
sumBy 根據函數映射每個元素,然后返回數組的和。
toDecimalMark 將數字轉化為千分位格式,將數字轉化為千分位格式,可以在數字前面加上符號。
TypeOf
isNull 判斷類型Null。
isUndefined 判斷類型Undefined。
isBoolean 判斷類型Boolean。
isNumber 判斷類型Number。
isString 判斷類型String。
isSymbol 判斷類型Symbol。
isObject 判斷類型Object。
isRegExp 判斷類型RegExp。
isArray 判斷類型Array。
isFunction 判斷類型Function。
getType 獲取類型,全能型的typeOf。
url
insertUrl 根據對象中的參數匹配插入到url中。
URLSearchParams url 序列化和反序列化。
Url 返回網址的相關信息,模擬了 瀏覽器的 new URL(urlString) 部分功能
validator
graceChecker 表單驗證。
base64
encode base64加密。
decode base64解密。
prototype
match_all 擴展 String的原型方法 es2019的matchAll(未兼容瀏覽器)。
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規(guī)行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://m.hztianpu.com/yun/109575.html
摘要:總體介紹在互聯網金融行業(yè)一百多億其實也算不上大平臺,也就是二級陣營吧,其實每次的架構升級都是隨著業(yè)務重大推進而伴隨的,在前一代系統(tǒng)架構上遇到的問題,業(yè)務開發(fā)過程中積累一些優(yōu)秀的開發(fā)案例,在下一代系統(tǒng)開發(fā)中就會大力推進架構升級。 回想起從公司成立敲出的第一行代碼算起到現在也快三年了,平臺的技術架構,技術體系也算是經歷了四次比較重大的升級轉化(目前第四代架構體系正在進行中),臨近年底也想抽...
摘要:總體介紹在互聯網金融行業(yè)一百多億其實也算不上大平臺,也就是二級陣營吧,其實每次的架構升級都是隨著業(yè)務重大推進而伴隨的,在前一代系統(tǒng)架構上遇到的問題,業(yè)務開發(fā)過程中積累一些優(yōu)秀的開發(fā)案例,在下一代系統(tǒng)開發(fā)中就會大力推進架構升級。 回想起從公司成立敲出的第一行代碼算起到現在也快三年了,平臺的技術架構,技術體系也算是經歷了四次比較重大的升級轉化(目前第四代架構體系正在進行中),臨近年底也想抽...
摘要:首先我們得有一個主心庫,這個庫十分重要,里面沒有業(yè)務邏輯的代碼,主要是平時開發(fā)時所需要的所有腳本,以及的一些基本依賴。創(chuàng)建衍生庫因為我們所有項目圍繞主心庫而衍生出來的,所以衍生庫和主心庫的關心和關系一致。 如何工程化開發(fā)大型angular2項目(上篇) 前請?zhí)嵋?目前前端項目越來越復雜,管理一個前端項目需要考慮的方面越來越多,例如工具選擇、項目構建、代碼自動review工具、代碼打包上...
摘要:,大家好,很榮幸有這個機會可以通過寫博文的方式,把這些年在后端開發(fā)過程中總結沉淀下來的經驗和設計思路分享出來模塊化設計根據業(yè)務場景,將業(yè)務抽離成獨立模塊,對外通過接口提供服務,減少系統(tǒng)復雜度和耦合度,實現可復用,易維護,易拓展項目中實踐例子 Hi,大家好,很榮幸有這個機會可以通過寫博文的方式,把這些年在后端開發(fā)過程中總結沉淀下來的經驗和設計思路分享出來 模塊化設計 根據業(yè)務場景,將業(yè)務...
閱讀 1372·2023-04-26 01:35
閱讀 2725·2021-11-02 14:44
閱讀 8090·2021-09-22 15:38
閱讀 2342·2021-09-06 15:11
閱讀 3861·2019-08-30 15:53
閱讀 918·2019-08-29 16:54
閱讀 803·2019-08-26 13:48
閱讀 1911·2019-08-26 13:47