Javascript グローバル変数について

Question

###前提・実現したいこと
htmlからJsに値を渡したい場合、
ソースコード1,2どちらの方が良いのか教えて頂きたいです。
個人的には１の方が安全な気がします。

エラーメッセージ

###該当のソースコード 1

<script type="text/javascript">
  var TESTDATE = {
    title : 'タイトルタイトル',
    text  : 'テキストテキスト'
  }
</script>
<script src="./test.js"></script>

###該当のソースコード 2

<script type="text/javascript">
  var TestTitle = "タイトルタイトル";
  var TestText  = 'テキストテキスト';
</script>
<script src="./test.js"></script>

Comments

[ockeghem]

HTMLからJSにデータを渡すとのことですが、そのHTMLは固定なのでしょうか? それとも変化するのでしょうか? 固定ならば、どちらでも「安全」性には変わりないと思いますが…

[OOO_777]

HTMLは使う人によってタイトルなどのデータを使い分けたいので変化するイメージでお願いします。

[ockeghem]

それでは、値を外部の人が勝手に書き換えられる状況ではないのですね

[think49]

test.js の内部コードを教えて下さい。

[OOO_777]

ockeghemさん　はい、そうなります。

[OOO_777]

think49さん　コメントありがとうございます。今回zohnamさんの回答をベストアンサーにさせて頂きました。

Answer 1

安全性という意味では違いはありませんが、開発上の利便性という意味では、前者のほうが優れています。
おそらく複数のページからこのデータを与えたいとう意図のはずですが、開発中に渡す項目が増えたり、特定のページのみに変数を設定したりという状況がうまれてくるものです。
そのとき、

  var TESTDATE = {
    title : 'タイトルタイトル',
    text  : 'テキストテキスト'
    code : 123// 特定のページのみ設定される
  }

のように与えられていれば、test.js内では

if (TESTDATE.code){
}

のようにシンプルに判定できます（codeに0が入ってちゃダメですけど）。

ひとつの変数の場合は、

 if (typeof TestCode !== undefined){
 }

こういう感じで、やや面倒になります。

また、あるページから与えられる変数群は、デバッグする時、だいだい全部まるごと把握したくなるものです。
そのとき、オブジェクトになっていれば

console.log(TESTDATE)

で一括で確認できます。

ただ、TESTDATEという名前だと、使うときに冗長で面倒になってきます。
web data という意味で、変数名はwdのように短くしておくのをおすすめします。

Comments

[OOO_777]

ご回答ありがとうございます。
そういう利点があったのですね、
勉強になりました。ありがとうございます。
変数名の件もありがとうございます。