始めに
こんにちは！
まんじです！！
今回はTypeScriptとJavaScriptどっちから勉強すべきなのかとかぶっちゃけどっちがいいんじゃ？というやつを書いていきたいと思います。
結論から書いてしまうと普通にTypeScriptのが良いんですけど、一概にTypeScriptだけやればJavaScript不要！みたく言いにくいのが地味に難しいところです。
そもそもTypeScriptはJavaScriptに型がついているだけなので、学習にかかる時間はそこまで増えませんし同じっちゃ同じです。
ただ問題なのが、TypeScriptを使うとするとJavaScriptにトランスパイル（TypeScriptをJavaScriptに変換するやつ）が絡んでくるので、そこが地味にムズイというか一概に言えないポイントです。
TypeScriptのほうがほとんどのケースでいいけれど、最初がムズイてきな。。。
解説！！
そもそもTypeScriptとはなんぞや？
TypeScriptはJavaScriptに型がついてるJavaScriptです。
「はあ？意味わからねーよ！しねえ！！！！」
と思うかもしれませんが、そのうちしぬので少しだけ待ってください。
具体例を書くとこんな感じになります。
- JavaScript
const add = (x, y) => {
return x + y;
}- TypeScript
const add = (x: number, y: number): number => {
return x + y;
}見比べてみると、xとyの横にnumberって表記と、アロー関数の右のほうにもnumberと書かれています。
すごくざっくりと書くなら、これがJavaScriptとTypeScriptの違いです。
変数と関数の引数や戻り値などに型（タイプ）がつくかつかないか、というのが1番の違いなのでございます。
「え！じゃあなしで書けるほうが簡単じゃないですかー！いちいち書くのだるぴ！」ってぼくも昔は思っていたんですけど、軽めのコードだと確かにその通りでJavaScriptのが簡単に書けます。
ただ、いわゆる実務って言われる複数人が一緒に書くコードや、自分の個人の開発でもそれなりに複雑なコードになってくるとこの型が輝き始めます。
これを見てください。
ジャン
const result = await this.repository.getRawDomainsWithCompany();「ふむ、resultは結果、、、関数名をみると、、、生のカンパニーと一緒のドメインズ??」
「どんな値が入っているんだろう・・・」
プログラミングをしているとこんな感じの状況によくなります。
これがJavaScriptだとまじで意味不明でconsole.logを打ち込んだりデバッカーで中身見たりするか、コードを完全に完璧に把握する必要があります。つらいです。
一方でこれがTypeScriptだと、resultのところをエディタでホバーしてあげると、どういう値が入っているのかが分かります。型が分かるってやつです。
関数名とかは上と少し違うけど、こういうイメージ。
ヌルポとか言う言葉がちょっと古き言葉ですが存在しまして、オブジェクト型のプロパティを参照しようとしたら、nullのプロパティを参照してエラーが出るみたいなそういうやつがプログラミングにはあります。
ブラウザのConsoleタブを開くとこんな感じでヌルポが再現できます。
この例だけ見るとそんなんやらんやろって思うかもなんですけど、複雑なコードや複数人でコードを書いていると結構発生します。
そんでもってこのエラーが発生するとフロントエンド側なら画面が真っ白になったり、バックエンドだとエラーになってアプリケーションサーバーが落ちちゃうとかそういう感じにもなります。
話はだいぶ脱線しちゃったんですが、「TypeScriptだとJavaScriptに型がついてて安全だよ❤️」っていうよくある表現に落ち着きます。
安全というかそこそこ規模がでかいコードになるとTypeScriptのがシンプルに書きやすいというか、逆にJavaScriptのがむずくね？って感じになります。
型以外の文法はJavaScriptとほぼ同じです。（同じだよね・・・？）
ちなみにTypeScriptが問題なく書ける人はJavaScriptも書けるようになります。（TypeScriptの文法はJavaScriptでただ型がついているだけだから）
なので、できればTypeScriptメインでやるほうが良いのかなと個人的には思っています。
JavaScriptはTypeScriptの下位互換じゃねーか！いらねえよな！？
ここまでの話からJavaScriptはTypeScriptの下位互換だしいらなくね？と思うかもしれません。
ただ1つJavaScriptにも良いところがあります。
それは何かっていうと、「こざかしい設定なしにすぐに書ける・動く」ってやつです。
TypeScriptを実行しようとすると多少の環境構築が必要になります。
なぜ環境構築が必要なのかというと、TypeScriptはTypeScriptのまま実行されずに一度JavaScriptに変換されてから（トランスパイルされてから）、それが実行されるのでその準備が必要だからです。
TypeScript書きましょう！
はいじゃあ10秒で実行してくださーい！
みたいなことがやりにくいんですけど、JavaScriptはできます。
JavaScript書きましょう！
はいじゃあ10秒で実行してくださーい！
みたいな感じのことを言われたらブラウザのConsole開いて10秒とかからずに書き始められます。
あとは本当にちょっとした操作なんかも型が不要なケースは多いので、そういった時もJavaScriptが便利です。
本当に少量のコードとかすぐに書きたいとかのケースにおいてはJavaScriptが有用なんすね。
それ以外だと強いていうなら、TypeScriptよりもJavaScriptのほうがプログラミング入門には適していると思います。
プログラミング入門の最初はとにかくハードルが低いほうがいいからです。
ちなみに最終的にTypeScriptをやることになった場合でも、JavaScriptを書いた時間とかは無駄にならないので、いわゆる駆け出しシーズンは結局どっちからでも良いってのは間違いないです。
ぼくは最近だとReact*TypeScriptを使っているんですけど、プログラミング入門時にjQuery*JavaScriptをやった時間が無駄になったかと言うと特に無駄だったとは言えない気がします。
JavaScript書いてたからこそ、TypeScriptの良さとかを比較してわかる的な側面もあるからです。
もしワイがプログラミング入門時に戻るとしたら
すでにTypeScriptがそれなりに書ける脳みそがあるのでもし入門者だったらとか言うのは微妙ですが、多分最初はJavaScriptからやるかもしれない・・・かも・・・と思います。
いや、、、できればTypeScriptをちゃちゃっと環境構築してやってしまったほうが・・・いいかも・・・。
結論: どっちでもOK
ただ、1つ言えることとしてはどっちみちTypeScriptには移行する運命にあるので、文法の学習はJavaScriptでやっても1ヶ月ぐらいしたらTypeScriptに乗り換えていくのがおすすめです。
正直最初は環境構築とかが難しく思えてめんどうなんですけど、1度できたらそれ以降は簡単です。
あ、でも、Reactをやる場合はTypeScriptからになると！思います！（ReactはJavaScriptで書くのがめんどくさすぎる）
まとめ
最終的にはTypeScriptになるけど、入門にはJavaScriptがいいかも〜って内容でした。
ぶっちゃけそこまでは変わらないというかJavaScriptがそれなりに書ければTypeScriptもすぐ書けるようになるので、あんまり気にせずに今直近でやることをこなしていけば良いと思います！
どっちからやったかとかで効率がめちゃくちゃ変わるとかはないですね！
この記事も読みなさい！
