第3回　リテラルと列挙型：TypeScriptで学ぶJavaScript入門（1/2 ページ）

プログラミング初心者向けのTypeScript入門連載の第3回はTypeScriptのリテラルについて解説。変数との違いについて押さえよう。また、列挙型と呼ばれる複数の変数を格納できる型についても説明する。

» 2014年07月07日 13時39分公開

[羽山博，著]

連載目次

　前回は変数について説明した。今回はその続きとして、リテラルと列挙型について解説する。

決まった値を表すリテラル

　前回は変数にデータ型があることや、データ型をどのように指定するかという方法について見たが、変数に代入される1200や"Hello"といった値についても少し整理しておこう。これまでは、あえて「データ」とか「値」という曖昧な言葉を使っていたが、こういった、決まった値は「リテラル」と呼ばれる。真偽値を表すtrueやfalseもリテラルである。

　では、整数リテラルから見ていこう。整数リテラルには10進数、16進数、8進数がある。書き方のルールは以下の通りだ。ただし、8進数はJavaScriptの古いバージョンとの互換性のために使われるもので、Playgroundでは、0で始まる数字を書くとコンパイルエラーになる。


数値の表記方法	使われる文字
10進数	1～9で始まる数字（0～9）の並び
16進数	0xで始まる数字（0～9、a～f、A～F）の並び
8進数	0で始まる数字（0～7）の並び

整数リテラルの書き方
※いずれも先頭に符号を表す「＋」または「－」を付けられる。

　このように、数字として使える文字の並びが厳密に決められているので、これ以外の文字を使うと整数と見なされない。例えば、以下のように書いたものは整数リテラルとして使える。

1200
-3
0x1F // （16進数の1F。10進数なら31）
012 // （8進数の12。10進数なら10。ただし、8進数の表記はTypeScriptではエラーとなる）

整数リテラルの例

　しかし、以下の例は整数リテラルとは見なされない。

1,200
1,200円
0x1G // （Gは16進数で使える文字ではない）

整数リテラルとは見なされない例

［コラム］ECMAScript 5における8進数の取り扱い

　JavaScriptの文法はECMA（European Computer Manufacturers Association） Internationalと呼ばれる標準化団体で策定されているECMAScriptに準拠しています。最新のバージョンはECMAScript 5.1で、多くのブラウザーでこの標準に準拠したJavaScriptが使えます。そして、TypeScriptでは次期バージョンであるECMAScript 6の機能を先取りして導入しています（クラス、ラムダ関数など）。

　ところで、ECMAScript 5以降では0で始まる数字を8進数として取り扱うことは推奨されていません。TypeScriptでも0から始まる数字を書くとエラーになります（ただし、互換性のためJavaScriptでは使えるようにはなっています）。

　Visual Studioでは、［TypeScript を使用した HTML アプリケーション］プロジェクトを新規作成した後、メニューバーから［プロジェクト］-［<プロジェクト名>のプロパティ］を選択し（あるいはソリューションエクスプローラーでプロジェクトを右クリックして［プロパティ］を選択し）、プロパティページにある［TypeScript ビルド］タブを開けば、[ECMA バージョン]リストで対応バージョンが選択できます。既定値は［ECMAScript 5］ですが、［ECMAScript 3］を選択すると、8進数も使えるようになります）。一方、Node.jsではtscコマンドの既定値がECMAScript 3となっているので、8進数を使ってもコンパイルエラーにはなりません。ECMAScript 5対応にしたい場合は、以下のコマンドラインを入力してコンパイルを実行します。

tcs -t ES5 ファイル名

Node.jsのtscコマンドでECMAScript 5準拠でTypeScriptプログラムをコンパイルする

　なお、ECMAScriptの詳細なバージョン情報についてはMDN（Mozilla Developer Network）の「JavaScript 言語情報」を参照してください。

　浮動小数点数リテラルは、小数点や指数表記を使った数値と考えてよい。以下の文字を使って表す。

0～9、+、-、.（小数点）、eまたはE（指数を表す）

浮動小数点数の表記に使える文字

　例えば、以下のようなものが浮動小数点数リテラルになる

3.14
0.12e+4 // （0.12×10⁴を表す）
-2.178E-3 // （-2.178×10^-3を表す）

浮動小数点リテラルの例

　文字列リテラルは引用符で囲まれた文字の並びである。例えば、以下のようなものである。

"Hello"
'こんにちは'
"100"

文字列リテラルの例

　引用符は、単一引用符（'）でも二重引用符（"）でも構わない。もちろん、単一引用符で文字列を始めて二重引用符で閉じるというように、開始と終了が一致していないとコンパイルエラーになる（JavaScriptでもエラーになる）。

　文字の並びの中には、タブ文字や改行文字なども含めることができる。これらの文字はキーボードから入力できないので、\（バックスラッシュ）の後に1文字を指定して以下のように表す。


特殊文字	意味
\b	バックスペース
\f	改ページ
\n	改行文字
\r	キャリッジリターン（復帰文字）
\t	タブ文字
\v	垂直タブ
\'	単一引用符
\"	二重引用符
\\	\そのもの
「\」で始まる特殊文字

　フォントによっては「\」が「＼」ではなく「￥」と表示されることもあるが働きは同じである。

　例えば、以下のコードを実行すると、図5のような結果が表示される。

alert("文字列リテラルは\n単一引用符(\')または二重引用符(\")で囲む");

特殊文字を含んだ文字列

$「\n」の箇所で改行され、「\'」や「\"」が「'」や「"」という文字そのものとして扱われた$ 「\n」の箇所で改行され、「\'」や「\""」が「'」や「"」という文字そのものとして扱われた

　ここで注意しないといけないのは「\n」などは「\」と「n」の2文字ではなく「\n」で1つの文字を表すということだ。例えば、文字列の長さはlengthプロパティを使って得られるので、以下のコードを実行すると、結果は2ではなく1となる。

alert("\n".length);

「\n」は2文字ではなく1文字を表す

［コラム］プリミティブ型のデータもオブジェクトのように振る舞う

　numberやstringなどのプリミティブ型のデータはオブジェクトのように扱うこともできます。といっても、オブジェクトがどういうものであるかまだ説明していないので、これだけでは何のことかさっぱり分からないかもしれませんが、取りあえずは「オブジェクトとはデータそのものとデータを取り扱うための手続きをまとめたもの」とでも考えておくといいでしょう。例えば、以下のコードを実行すると、結果は「5」と表示されます。

alert("Hello".length);

文字列“Hello”の長さを調べる

　この「length」というのは文字列の長さを表すプロパティ（＝オブジェクトごとの性質）です。また、以下のコードを実行すると、「l」と表示されます。

alert("Hello".charAt(2));

指定した位置にある文字を取り出す

　「charAt」は指定された位置の文字を取り出すメソッド（＝オブジェクト自身が実行できる操作で、これを呼び出すと何らかの処理が実行される。プログラミングでは「手続き」とも表現される）なのです（2と指定したのに「e」ではなく「l」が表示されたのは、先頭の文字を0文字目と見なすからです）。

　もちろん、リテラルではなく変数を使っても同じことができます。例えば、以下のコードを実行すると、最初の例と同じように「5」が表示されます。

var greetings:string = "Hello";
alert(greetings.length);

リテラル値ではなく、変数に格納されたオブジェクトのプロパティにアクセスする

　このように「.」で区切ってプロパティやメソッドを書けば、そのデータに関する属性を取り出したり、そのデータを処理したりできます。プリミティブ型のデータも単なる値として取り扱われるだけでなく、自分自身を処理する方法を知っているモノ（オブジェクト）として扱えるというわけです。

　なお、文字列リテラルの各文字はUTF-16と呼ばれる文字コードで表されるので、その文字コードを「\u」の後に続けて書いてもよい。例えば、以下のようにすれば、「愛」という文字が表示される。

alert("\u611B");