•   suis
  • 23 Feb, 2018
  • Tags

JavaScriptではなくTypeScriptを選ぶ利点

静的型付けな言語

JavaScriptのコーディング

世の中にはたくさんのプログラミング言語が存在しますが、中でもブラウザと相性が良いものがJavaScriptです。
これは通常、サイト上に配置されておりブラウザ上で実行することができます。
また近年ではNode.jsというプラットフォームが登場することによりサーバ上で実行できるようにもなりました。

ただこのJavaScript、そのまま扱うにはなかなか、結構、相当きびしいものがあると個人的には思います。
言語の仕様上曖昧な記述で実行できてしまうのでエラーを見つけ難く、またコーディング自体も混乱しがちだったりするのです。
例えば以下のコードを見てみましょう。


var a="a";
console.log(a);
a=8;
console.log(a);

まず1行目で「a」という変数を宣言し、中には文字列の「a」を入れています。
これを出力すると当然「a」が表示されます。
ですが3行目では変数aに数値の「8」を入れているにも関わらずそのまま通り、4行目の出力時には「8」と表示されるのです。

JavaやCといったプログラムに慣れている場合「一体どういうことなの…」と呆然とするかもしれません。
これは動的型付けという性質で、実行時に動的に型をつけているのです。
そのため数値と文字列が混在した型であってもJavaScriptは受け入れてしまいます。
もし規模の大きな開発を動的型付けをベースとして行う場合、大変な事態が起こらないとも限りません。
それから次のコードにも問題が含まれています。


var a=10;
var a="hoge";
var a=10000;
console.log(a);

見れば分かる通り「a」という変数が3つも宣言できてしまいます。
このコードは何もエラーを返さずに実行でき、出力結果は最後にaに代入した「10000」が表示される形です。

これはJavaScriptに備わっている「変数の再定義」という仕様なのですが、それが故にJavaScriptは慎重にコーディングしていかなければなりません。
また、エラーを起こさずに実行できるという点はデバッグ作業を極めて困難なものにしてしまうでしょう。
しかもこのvarという宣言をして作成した変数はどこからでもアクセスできるというやっかいな特性ももっています。
うっかり手癖でvar tempなどの変数を宣言しそのまま放置したら…大変なことになるはずです。

といってもJavaScriptでは「let」という宣言ができるようになりました。
このletによって宣言された変数は宣言した範囲内でのスコープでしか使えず、かつ重複する宣言も認めないようになっています。
そいつはありがたい、と言いたい所ですが下記のコードは実行されてしまいます。


let a=10;
a="hoge";
console.log(a);

このコードの出力結果は「hoge」となるのです。
宣言の重複やスコープを限定できても型を限定できないため、やはりそのまま使うのは危ないといえるでしょう。

TypeScriptの静的型付け


TypeScriptはJavaScriptが含んでいる様々な問題をより扱いやすくしたスクリプト言語です。
最終的にはJavaScriptへ変換し実行することになるため、TypeScriptで書いたコードを直接実行できるわけではありません。
流れとしてはTypeScriptの記法で書いたコードはトランスパイラというものを通しJavaScriptへ変換した上で実行するという形になります。


TypeScriptでは前述した問題を解決してくれます。
例えば変数は以下のように型を指定して宣言できるのです。


let a : number;

この宣言はletなので重複することなく、またスコープも限定されています。
そして変数名の後に「: number」と指定することで数値であることを明示することができるのです。
そのためこの後に「a = "hoge";」とすることはできません。
この仕組みがあるだけで、それだけで原因の分かり辛い問題を回避することができるでしょう。

また通常のJavaScriptではクラスを定義するときに変則的な宣言の仕方をしなければいけませんが、TypeScriptでは素直に「class hoge{…}」とすることができます。

このように、JavaScriptで危ないと思われる箇所を改善したものがTypeScriptという言語になります。
ただ既にJavaScriptに慣れている場合、静的型付きの仕様が煩わしいと感じるかもしれません。
厳密さを優先するか効率を優先するかは書く人に委ねられますが、JavaScriptの大らかな仕様に抵抗を感じているならTypeScriptを試す価値はあるはずです。

試せるサイトも存在


「TypeScriptを書いてみたいけど実効環境を作るのが面倒」という場合は以下のサイトを訪れてみると良いでしょう。
参考:http://www.typescriptlang.org/play/
このサイトではTypeScriptなコードを実行することができ、かつJavaScriptにしたときのコードも見ることができます。
ここで色々と書いてみて、気に入ったなら開発環境を整えてみましょう。

Additional Images




Related Link (Reference Blog)

Comments

Add Your Comments

Contact Us
Let us find the perfect source code for your app.

Become a PieceX Insider!