目次
はじめに
Reactなどのフレームワークを使用していない純粋なHTML/JavaScriptでグローバル定数を使用する方法を記載します。
プロジェクト構成
プロジェクトの構成は以下とします。
project ┣ index.html ┣ index.js ┗ const.js
グローバル定数の定義
「const.js」に以下のように定数を定義します。
ここでは、「HELLO」「SAMPLE」の２つの定数を定義しています。
Object.defineProperty(window, "HELLO", {
value: "ハロー",
writable: false,
});
Object.defineProperty(window, "SAMPLE", {
value: "サンプル",
writable: false,
});
グローバル定数の取得
「index.js」に以下のように定数を定義します。
「HELLO」「SAMPLE」の２つの定数を取得してコンソール出力しています。
console.log(HELLO); console.log(SAMPLE);
HTMLで呼び出し
「index.html」に以下のように定数を定義します。
グローバル定数定義のJSファイルをインポートする必要がある点が注意です。
<!DOCTYPE html>
<html lang="ja">
<head>
<title></title>
<meta charset="UTF-8" />
<script src="./const.js"></script>
<script src="./index.js"></script>
</head>
<body></body>
</html>
以下のGitHubにソースコードをアップしていますので、実際に確認したい方はPullしてご確認ください。
