JavaScript函数核心概念与高级应用全解析
2026/7/18 4:15:41
做过电商 PC 端开发的兄弟估计都懂:经常得弄个「绝不会跟别的重样的编号(ID)」—— 比如给弹窗、临时加的商品条目、页面里动态蹦出来的元素做标识,免得代码把东西搞混。这事看着好像随手就能写,但真要做到百分百不重复,可比想的要坑。
今天就唠唠大伙常踩的俩坑,再给你说个浏览器自带的、一行代码搞定的靠谱法子。
好多人(不管是刚入门的还是干了俩年的)第一反应都是:把当前时间加个随机数不就行了?比如会写这么一段代码:
function generateNaiveId() { return Date.now().toString(36) + Math.random().toString(36).substr(2); }出来的结果大概是l6n7f4v2am50k9m7o4这种,看着好像既有时间的 “独一份”,又有随机数的变化,挺好用?但真放到正经的生产环境里,这就是个定时炸弹:
Date.now()只能精确到毫秒,要是在同一毫秒里连续调用两次这个函数 —— 比如用户点按钮点的特别快,或者页面一下子要生成好几个 ID—— 那 ID 的前半段就会完全一样Math.random()那玩意生的不是啥 “靠谱随机数”,运气背的时候,短时间内可能跑出一模一样的序列说白了,这种法子也就用在半天用一次的场景里凑活,真要讲 “绝对不重复”,差得远了。
还有人想的更简单:整个全局的数字,每次生成 ID 就把数字加 1,从 0 开始往上排不就得了?但这个法子的问题更离谱:
其实现在的现代浏览器(还有
Node.js14 以上的版本),早就给咱们内置了靠谱的工具 ——crypto.randomUUID(),一行代码就能生成绝对靠谱的唯一 ID:
const uniqueId = crypto.randomUUID();出来的结果是这种格式:3a6c4b2a-4c26-4d0f-a4b7-3b1a2b3c4d5e为啥说这个是王者?
Math.random()那种随便凑的,没法被轻易猜到而且现在主流的新浏览器都支持这个方法:Chrome92 以上、Firefox90
以上、Safari15.4 以上都能用,要是你做的是新项目,直接用这个就行,再也不用自己瞎写凑数的 ID 生成器了。