JavaScriptにおける一意識別子の生成

JavaScriptJavaScriptBeginner
今すぐ練習

This tutorial is from open-source community. Access the source code

💡 このチュートリアルは英語版からAIによって翻訳されています。原文を確認するには、 ここをクリックしてください

はじめに

この実験では、JavaScriptを使ってブラウザでUUIDを生成する方法を探ります。UUID(Universally Unique Identifier)は、システム内のリソースを一意かつ普遍的な方法で識別するために使用される128ビットの値です。この実験が終了するまでに、Webアプリケーションで使用できる適切なUUIDを生成する方法を十分に理解しているでしょう。


Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL javascript(("JavaScript")) -.-> javascript/BasicConceptsGroup(["Basic Concepts"]) javascript/BasicConceptsGroup -.-> javascript/variables("Variables") javascript/BasicConceptsGroup -.-> javascript/data_types("Data Types") javascript/BasicConceptsGroup -.-> javascript/arith_ops("Arithmetic Operators") javascript/BasicConceptsGroup -.-> javascript/comp_ops("Comparison Operators") subgraph Lab Skills javascript/variables -.-> lab-28686{{"JavaScriptにおける一意識別子の生成"}} javascript/data_types -.-> lab-28686{{"JavaScriptにおける一意識別子の生成"}} javascript/arith_ops -.-> lab-28686{{"JavaScriptにおける一意識別子の生成"}} javascript/comp_ops -.-> lab-28686{{"JavaScriptにおける一意識別子の生成"}} end

ブラウザでUUIDを生成する

ブラウザでRFC4122バージョン4に準拠するUUIDを生成するには、次の手順に従います。

  1. ターミナル/SSHを開き、nodeと入力します。
  2. Crypto.getRandomValues()メソッドを使ってUUIDを生成します。
  3. Number.prototype.toString()メソッドを使ってUUIDを16進数文字列に変換します。
  4. 次のコードを実装します。
const UUIDGeneratorBrowser = () =>
  ([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, (c) =>
    (
      c ^
      (crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (c / 4)))
    ).toString(16)
  );
  1. UUIDGeneratorBrowser()関数を呼び出してUUIDを生成します。たとえば、UUIDGeneratorBrowser()'7982fcfe-5721-4632-bede-6000885be57d'を返します。

まとめ

おめでとうございます!Generate UUID (Browser) の実験を完了しました。LabExでさらに多くの実験を行って、スキルを向上させましょう。