JavaScript 如何写工具库
你有没有遇到过这种情况:写网页时,明明要做的只是“把数字转成带千位分隔符的价格”,却反复在不同页面复制粘贴同一段代码;或者需要验证手机号格式,每次都要重新写正则,还总怕写错符号?其实,很多重复的代码逻辑,都可以打包成“工具库”统一管理,既省时间又不容易出错。今天就用生活化的例子,讲讲JavaScript里怎么写实用的工具库。
先想清楚:你需要什么样的工具库?
工具库不是越大越好,关键是贴合自己的需求。就像家里的工具箱,不会把锤子、螺丝刀、扳手混着堆,而是按“拧螺丝”“敲东西”分类。写JS工具库也是一样,先梳理自己常重复写的代码:比如处理时间、格式化文本、验证输入这些高频功能,就可以归到一起。

举个例子:做电商网站时,经常要把“123456”变成“123,456”的价格格式;做用户中心时,要判断输入的手机号是不是11位数字;做新闻页时,要把发布时间变成“3天前”这种友好的显示方式。这些都是独立的小功能,刚好适合打包成工具库。
第一步:用对象把功能“装起来”
JS里最简单的工具库,就是一个普通的对象。你可以把所有相关的函数都放到这个对象里,就像把不同的小工具放进一个工具箱,拿的时候直接从箱子里取,不会乱。
比如,我们先建一个叫myUtils的工具箱,把刚才说的价格格式化、手机号验证、时间转换都放进去:
`javascript
// 建一个工具库对象,就像装小工具的箱子
const myUtils = {
// 功能1:把数字转成带千位分隔符的价格
formatPrice(num) {
// 转成字符串,用正则每3位加个逗号
return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',');
},
// 功能2:验证是不是11位手机号
isPhone(phone) {
// 用简单的正则判断,1开头+10位数字
return /^1\d{10}$/.test(phone);
},
// 功能3:把时间转成“X天前”的友好格式
formatTime(timestamp) {
const now = Date.now();
const diff = now - timestamp;
// 算差了多少天,不足1天就显示“今天”
const days = Math.floor(diff / (1000 * 60 * 60 * 24));
return days > 0 ? ${days}天前 : '今天';
}
};
`
这样用的时候就很方便,比如要格式化价格,写myUtils.formatPrice(123456),直接返回“123,456”,不用再每次写重复的代码。
第二步:让工具库更灵活,也更“安全”
刚才的对象工具库已经能用,但有个小问题:如果别人不小心改了myUtils里的函数,比如把formatPrice写错,所有用这个功能的地方都会出错。就像工具箱里的螺丝刀被掰弯,拧螺丝就会出问题。
怎么解决?可以用ES6的类来写工具库,或者给函数加“默认参数”,还能限制别人随便改内部的功能。比如给formatTime加个默认的时间基准,不用每次都传当前时间:
`javascript
class TimeUtils {
// 加默认参数,不传就用当前时间
formatTime(timestamp, now = Date.now()) {
const diff = now - timestamp;
const days = Math.floor(diff / (1000 * 60 * 60 * 24));
return days > 0 ? ${days}天前 : '今天';
}
}
// 用的时候先实例化,就像打开工具箱
const timeUtil = new TimeUtils();
// 不用传now,直接用默认的当前时间
console.log(timeUtil.formatTime(1710000000000));
`
如果担心别人改你的工具,还可以把工具库写成“不可修改”的,比如用Object.freeze(myUtils),就像给工具箱加个锁,外人不能随便改动里面的工具,只能正常使用。
第三步:工具库的“升级”:分享给别人用
如果你的工具库做得好,还可以分享给其他项目用。比如把刚才的代码放到单独的utils.js文件里,其他网页只要用<script src="utils.js"></script>引入,就能直接用myUtils或者TimeUtils里的功能。
要是想让不同的项目都能用,还可以用模块化的方式,比如把函数导出,其他项目里通过import引入,就像把工具箱放到共享储物间,所有家人都能拿。
简单来说,JS写工具库的核心,就是把重复的小功能打包成可复用的模块,从简单对象开始,再慢慢优化安全性和灵活性,最后根据需求扩展功能。不用一开始就追求复杂,先把自己常用的小功能打包好,就能大幅减少重复代码,让开发更省心。