JavaScript 前端生成 GUID 的实现方法与原理

作者:函数茶馆

时间:2026-10-29

浏览:464

本文介绍在前端 JavaScript 环境中生成 GUID(全局唯一标识符)的方法。由于浏览器无法直接获取网卡 MAC 地址和纳秒级时间,文中提供了一种基于系统时间与随机十六进制数组合的模拟实现方案。该方案通过封装 GUID 类,利用 Date 对象和随机数生成唯一字符串,虽然存在极低的重复概率,但在常规前端开发中已足够使用。

文章目录

GUID 概述与前端生成挑战

GUID(全局统一标识符)是一种用于标识信息的数字串,旨在确保在同一时空范围内的所有机器中其值唯一。大多数平台都提供了生成 GUID 的 API。其生成算法较为复杂,通常涉及以太网卡地址、纳秒级时间戳、芯片 ID 码以及大量可能的数字组合。GUID 的主要缺点在于生成的字符串长度较大。

GUID 的标准格式为:xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx。

虽然在前端开发中,GUID 的直接应用场景相对有限,但在某些需要插入特定 ID 且该 ID 需与后台系统或其他需要 GUID 的操作保持一致的场景下,前端生成 GUID 仍具有便利性。

前端模拟生成 GUID 的实现

在 SQL、Java、C# 等后端语言或数据库中,生成 GUID 通常非常简单。然而,前端环境没有直接生成 GUID 的原生方法,因此需要手动编写代码实现。由于 GUID 的严格标准通常需要获取以太网卡的物理地址以及纳秒级的时间戳,而前端获取这些信息较为困难(如有了解者请分享),我们可以采用模拟方式来生成 GUID,具体代码如下:

GUID 对象代码实现


/*
 * 功能:生成一个GUID码,其中GUID以14个以下的日期时间及18个以上的16进制随机数组成,GUID存在一定的重复概率,但重复概率极低,理论上重复概率为每10ms有1/(16^18),即16的18次方分之1,重复概率低至可忽略不计
 * 免责声明:此代码为作者学习专用,如在使用者在使用过程中因代码问题造成的损失,与作者没有任何关系
 * 日期:2014年9月4日
 * 作者:wyc
 */

 
function GUID() {
  this.date = new Date();

  /* 判断是否初始化过,如果初始化过以下代码,则以下代码将不再执行,实际中只执行一次 */
  if (typeof this.newGUID != 'function') {
    
    /* 生成GUID码 */
    GUID.prototype.newGUID = function() {
      this.date = new Date();
      var guidStr = '';
        sexadecimalDate = this.hexadecimal(this.getGUIDDate(), 16);
        sexadecimalTime = this.hexadecimal(this.getGUIDTime(), 16);
      for (var i = 0; i < 9; i++) {
        guidStr += Math.floor(Math.random()*16).toString(16);
      }
      guidStr += sexadecimalDate;
      guidStr += sexadecimalTime;
      while(guidStr.length < 32) {
        guidStr += Math.floor(Math.random()*16).toString(16);
      }
      return this.formatGUID(guidStr);
    }

    /*
     * 功能:获取当前日期的GUID格式,即8位数的日期:19700101
     * 返回值:返回GUID日期格式的字条串
     */
    GUID.prototype.getGUIDDate = function() {
      return this.date.getFullYear() + this.addZero(this.date.getMonth() + 1) + this.addZero(this.date.getDay());
    }

    /*
     * 功能:获取当前时间的GUID格式,即8位数的时间,包括毫秒,毫秒为2位数:12300933
     * 返回值:返回GUID日期格式的字条串
     */
    GUID.prototype.getGUIDTime = function() {
      return this.addZero(this.date.getHours()) + this.addZero(this.date.getMinutes()) + this.addZero(this.date.getSeconds()) + this.addZero( parseInt(this.date.getMilliseconds() / 10 ));
    }

    /*
    * 功能: 为一位数的正整数前面添加0,如果是可以转成非NaN数字的字符串也可以实现
     * 参数: 参数表示准备再前面添加0的数字或可以转换成数字的字符串
     * 返回值: 如果符合条件,返回添加0后的字条串类型,否则返回自身的字符串
     */
    GUID.prototype.addZero = function(num) {
      if (Number(num).toString() != 'NaN' && num >= 0 && num < 10) {
        return '0' + Math.floor(num);
      } else {
        return num.toString();
      }
    }

    /* 
     * 功能:将y进制的数值,转换为x进制的数值
     * 参数:第1个参数表示欲转换的数值;第2个参数表示欲转换的进制;第3个参数可选,表示当前的进制数,如不写则为10
     * 返回值:返回转换后的字符串
     */
    GUID.prototype.hexadecimal = function(num, x, y) {
      if (y != undefined) {
        return parseInt(num.toString(), y).toString(x);
      } else {
        return parseInt(num.toString()).toString(x);
      }
    }

    /*
     * 功能:格式化32位的字符串为GUID模式的字符串
     * 参数:第1个参数表示32位的字符串
     * 返回值:标准GUID格式的字符串
     */
    GUID.prototype.formatGUID = function(guidStr) {
      var str1 = guidStr.slice(0, 8) + '-',
        str2 = guidStr.slice(8, 12) + '-',
        str3 = guidStr.slice(12, 16) + '-',
        str4 = guidStr.slice(16, 20) + '-',
        str5 = guidStr.slice(20);
      return str1 + str2 + str3 + str4 + str5;
    }
  }
}

GUID 对象

只需将上述代码保存为一个 JS 文件并在页面中引用即可使用。

随后我们只需要

代码如下:

var guid = new GUID();
alert(guid.newGUID());

即可获取生成的 GUID 码。

生成原理与局限性分析

其实现原理相对简单,主要采用系统时间与 18 个以上的十六进制随机数进行组合,并将系统时间转换为十六进制格式。尽管这种模拟方法理论上仍存在重复的可能性,但重复概率极低,在实际应用中可忽略不计。

以上为本人编写的生成 GUID 的方法,如有更优的实现方案,欢迎交流指正,谢谢!

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章