【初心者向け】TypeScriptって何?JavaScriptと何が違うの?

TypeScriptLogo
初心者
JavaScript を勉強してみたいのですが、今勉強を始めるなら TypeScript!という話をよく聞きます。どちらから始めるのがよいのでしょうか?

TypeScript って何?JavaScript と何が違うの?

プログラミング、特にウェブ開発に興味のある人は誰しも知っている JavaScript という言語。

JavaScript はウェブページ上で簡単に動作するので、プログラミング初心者にとって非常に学びやすく、また目まぐるしいスピードで成長を続ける勢いのある言語です。

 

JavaScript を学ぶのは非常にいい選択ですが、ちょっと待ってください。実際中規模以上の ウェブアプリケーションの開発に使われているのは、TypeScript なのです。

JavaScript を学ぶ前に知っておくべき、JavaScript の弱点と、それを補う TypeScript についてお話しします。

書いた人
私は、実務経験 JavaScript3 年・TypeScript 歴の 1 年のシステムエンジニアです。
JavaScript は独学で勉強しエンジニアになりました。私と同じように独学での勉強を考えている方に、この記事が勉強の指針となれればと思います。

TypeScript とは?

TypeScript とは Microsoft によって開発された、JavaScript に静的型付けを追加した言語です。

もっと簡単に言いましょう、TypeScript は JavaScript で縛りプレイをするための言語です。

ルール(型)を厳密に定め、時には JavaScript 以上に長いコードを書かなければいけません。

更に TypeScript で書かれたコードはトランスパイル(翻訳)されて JavaScript になります。実行されるときには必ず JavaScript になるのです。

 

なぜそんな面倒臭いことをするのでしょう?なぜそんな言語が使われているのでしょうか?JavaScript で最初から書けばいいと思いませんか?

なぜ JavaScript じゃダメだったのか?

結論を述べると、JavaScript は自由すぎて収拾がつかなかったからです。

その原因の一つが動的型付けです。

動的型付けとは?

JavaScript は動的型付けの言語です。動的型付けの言語では変数になんでも好きなものを格納することができます。

変数 foo に文字列型 ”Hello World” を代入することもできるし、数値型  100  を再代入することもできます


//変数fooの定義
let foo;
//文字列の代入
foo = "Hello World";
//数値の再代入
foo = 100;

プログラムが勝手に中身が何なのかを判断して、型を用意してくれるのです。型の中身がコロコロ変わっても、プログラマーは一切型を気にせずに簡単にプログラムを実装できます。

動的型付けには様々なデメリットもありますが、この手軽さは JavaScript の絶大な人気を支えた一端でしょう。

しかし、この手軽さが裏目に出たのでした。

成長しすぎた JavaScript

JavaScript の当初の目的はウェブページに小さな動きを追加する程度の小規模なものでした。

型の中身がコロコロ変わっても、小規模であれば十分把握できます。

 

しかし今や目新しいウェブサイトが次々に生まれ、そのどれもが複雑な動きや機能を持っています。

開発も大人数で行われるようになり、当然そのコードを完全に把握している個人はいなくなってしまいました。

こうなると動的型付けは危険です。自分が定義した変数に、後から別のメンバーがなんでも好きなものを再代入できるのです。

もしくは過去に自分が書いたコードを忘れて、自分自身が書き換えてしまうかも…

 

あなたは昨日の夕飯を覚えていますか?

TypeScript の登場

変数の書き換えによる事故を防ぎ、中規模以上の開発をよりスムーズに行うために TypeScript は生まれました。

 

先ほども申し上げた通り、TypeScript は静的型付けが可能です。変数を定義する際に型を指定し、違ったものが代入することはできなくなります。

もし型の違うものが代入される場合、トランスパイル(翻訳)の際にエラーで知らせてくれます。

また自分で型を作成することも可能で、何のための変数であるかをコメントや名前だけでなく、強制力を持った定義としてチームメンバーやのちの自分に伝えることができます。

確かに型を考え、その限られた中で開発を進めるより、型を考えずにどんどん開発を進めたほうが最初は早く開発が進むでしょう。

しかし、開発の規模が大きくなり自身の把握できていないコードがプログラム内にあふれてきたとき、静的型付けは開発者を強制的に正しい方向へ導いてくれるのです。

じゃあTypeScriptをさっそく始めよう!

と言いたいところですが、プログラミング初心者がいきなりTypeScriptから覚えることを私はお勧めしません。

というのも、そもそも JavaScript が初心者におすすめな理由は「簡単に実行可能だから。」です。

初心者の独学のコツは、いかにモチベーションを保つか。だと私は思います。

私がプログラミングを独学で始めた時、Python や Ruby は環境の構築や、version の違いによるエラーなどに手を焼き、実際に画面を動かしはじめて面白さを感じるまでに随分手がかかった思い出があります。

それに比べて JavaScript は最悪メモ帳とブラウザがあれば動作します。

圧倒的に手軽です。すぐにプログラムが動作させることができて、一気にその面白さにのめりこみました。

もちろん自分が使いたい用途に合わせて言語を選ぶ必要はありますが、初心者だった私にとってこの JavaScript の手軽さはモチベーションを保つために非常に重要だったと感じています。

TypeScript は環境の構築から始めなければならず、導入は初心者にとって大きな障害になるでしょう。せっかくの JavaScript の利点を潰してしまいかねません。

まとめ

では今まで書いてきたことは無意味だったのかというと、そうではありません。

あなたが JavaScript を学び続ければ、自分の書いたプログラムの全体を把握しきれなくなる日が必ず来ます。

あなたが十分に力を身に着けたその時こそ、TypeScript を学ぶ時です。

 

JavaScript の弱点を知っているあなたなら、動的型付けのデメリットに振り回されることなくスムーズにレベルアップできることでしょう。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA