当前位置:首页 > JavaScript

js实现guid

2026-04-06 23:10:00JavaScript

生成 GUID 的方法

在 JavaScript 中,可以通过多种方式生成 GUID(全局唯一标识符)。以下是几种常见的实现方法:

使用 crypto API(推荐)

现代浏览器支持 crypto API,可以生成符合 RFC 4122 标准的 UUID:

js实现guid

function generateUUID() {
    return ([1e7]+-1e3+-4e3+-8e3+-1e11).replace(/[018]/g, c =>
        (c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
    );
}
console.log(generateUUID()); // 示例输出: "7982fcfe-5721-4632-bede-6000885be57d"

使用 uuid

第三方库 uuid 提供了简单可靠的 UUID 生成功能:

js实现guid

import { v4 as uuidv4 } from 'uuid';
const id = uuidv4();
console.log(id); // 示例输出: "1b9d6bcd-bbfd-4b2d-9b5d-ab8dfbbd4bed"

自定义随机字符串实现

如果不需要严格符合 UUID 标准,可以使用随机字符串模拟 GUID:

function generateSimpleGUID() {
    return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
        const r = Math.random() * 16 | 0;
        const v = c === 'x' ? r : (r & 0x3 | 0x8);
        return v.toString(16);
    });
}
console.log(generateSimpleGUID()); // 示例输出: "a3e8f1d4-c5f6-4b9a-8e7d-0f2c3b1a6e5d"

性能优化版本

对于需要高频生成 UUID 的场景,可以使用预分配的 Uint8Array:

const uuidBuffer = new Uint8Array(16);
function generateFastUUID() {
    crypto.getRandomValues(uuidBuffer);
    uuidBuffer[6] = (uuidBuffer[6] & 0x0f) | 0x40;
    uuidBuffer[8] = (uuidBuffer[8] & 0x3f) | 0x80;
    return Array.from(uuidBuffer)
        .map(b => b.toString(16).padStart(2, '0'))
        .join('')
        .replace(/(.{8})(.{4})(.{4})(.{4})(.{12})/, '$1-$2-$3-$4-$5');
}

注意事项

  • 浏览器环境下优先使用 crypto.getRandomValues() 而非 Math.random()
  • Node.js 环境可以使用 crypto.randomUUID()(Node 14.17.0+)
  • 如果需要严格的 RFC 4122 合规性,建议使用专门的库
  • 时间戳或计数器组合的方案不适用于分布式系统

标签: jsguid
分享给朋友:

相关文章

js图片上传实现

js图片上传实现

图片上传的基本实现 使用HTML的<input type="file">元素配合JavaScript的File API实现基础图片上传功能。HTML部分需要设置accept="image/…

js实现截图

js实现截图

使用HTML2Canvas库实现截图 HTML2Canvas是一个流行的JavaScript库,可以将网页元素或整个页面转换为Canvas图像。安装方式: npm install html2canv…

js实现div隐藏

js实现div隐藏

使用CSS的display属性隐藏div 通过设置元素的display属性为none,可以完全隐藏div元素。这种方法不仅隐藏元素,还会从文档流中移除,不占据页面空间。 document.getEl…

js实现选择目录

js实现选择目录

在JavaScript中实现选择目录的功能通常需要结合浏览器API或第三方库,以下是几种常见方法: 使用 <input type="file"> 的 webkitdirectory 属性…

用js实现vue

用js实现vue

用 JavaScript 实现 Vue 核心功能 Vue.js 是一个渐进式框架,其核心功能包括响应式数据绑定、虚拟 DOM 和组件系统。以下是一个简化版的实现,展示如何用原生 JavaScript…

vue.js实现拍照

vue.js实现拍照

Vue.js 实现拍照功能 在 Vue.js 中实现拍照功能通常需要结合浏览器的媒体 API(如 getUserMedia)和 Canvas 元素。以下是实现步骤: 准备工作 确保项目已安装 Vue…