発生している問題・実現したいこと
現在、プログラミングの学習を進めるにあたりTypeScriptを習得したいと考えています。
学習順序について、事前にJavaScriptの基礎をしっかり学んでからTypeScriptに入るべきか、最初からTypeScriptの学習を始めてしまって良いのか悩んでいます。
Web開発の現場で働いている先輩方や、独学で習得された方の視点から、おすすめの学習ルートやアドバイスをいただきたいです。
前提条件・現在のスキルセット
- 今まで業務ではインフラ側をメインで触ってきた
- 現在のプログラミング歴: [ HTML・CSSを少し触った程度 / Pythonは経験あり ]
自分なりに調べたこと・考えたこと
- TypeScriptはJavaScriptの拡張言語であるため、JavaScriptの知識が前提になると聞きました。
- 一方で、「JSの基礎を軽く触ったらすぐにTSに入ったほうが効率が良い」「最初からTSで書いて慣れたほうが良い」という意見も見かけました。
聞きたいこと
- 私の現在のスキルセットの場合、JavaScriptから始めるべきでしょうか？
- もしJavaScriptから始める場合、「ここまでは押さえておくべき」という最低限の学習項目はどこまででしょうか？
- 実務の観点から「こう学習すれば挫折しにくい」というロードマップがあれば教えていただきたいです。
よろしくお願いいたします。
回答4件
#1
総合スコア65
投稿2026/07/21 04:59
Python経験があるなら、JSをがっつりやってからTSへ、は遠回りだと思います。JS特有の部分だけ数日〜1週間でさらって、すぐTSに入るのがいいと思います！
押さえるべきJSの範囲は、アロー関数、配列操作(map/filter)、分割代入、async/awaitくらい。特に非同期処理はPythonと感覚が違うので重点的に学ぶといいと思います。
あとは最初からTSで小さいものを作るのが一番挫折しにくいです。TSは型を省いてもJSとして動くので、「動くものを書く→エラーが出たら型を学ぶ」の繰り返しで自然に習得できます。教材を読み切ってから書くより、書きながら学ぶ方が圧倒的に定着すると思います！
#2
総合スコア355
投稿2026/07/21 11:06
編集2026/07/23 05:53ぶっちゃけ、TypeScriptは良く知らんのだけど、原則、Pythonで型アノテーション使った事あるのなら多分分かりやすいんじゃないか。
実際問題、TypeScriptの「実装」ってのは存在してなくって、単に処理系は、TypeScriptで書かれたコードからPythonで言うトコの型アノテーションを引っ剥がしてフツーのJavaScriptコードへと変換する。まぁ、そのおかげで、JavaScriptの初期設計ミスのアレコレが回避出来ますよ、と言った程度の話にしか過ぎない(それはそれでデカいんだけれども)。TypeScriptで書いたから、と言って、フツーの静的型付け言語みたいに「実行時の型判定がない分速い」とか、そう言った現象は特にないんだ。最終的にフツーのJavaScriptに落ち着く以上、別段JavaScriptに対して速度的に有利、とかそういった話は出てこない。
JavaScriptの良い入門書は知らないし、TypeScriptに関しても知らない。ただ、JavaScriptの定番書籍と言えば多分これになるんじゃないか。まぁ、オライリー社の本だったらほぼハズレはないんでTypeScriptもその辺探せばいいだろう。
逆に日本の本はダメだと思う。これはJavaScriptに限った話じゃなくって、プログラミング関係の本は日本の本は避けた方が無難だ。割にいい加減な事書いてたりするし。
良くあるのが論理演算子に関しての記述ミスで、例えば次のように書いてる本は結果信頼がおけない。
複数の条件式(または論理値)を論理的に結合し、その結果をtrue/falseとして返します。
これはJavaScriptに於いては間違っていて、結果、そのテの記述ミスをする人は仕様書をキチンと確認せずに書いてる、と言う事だ。こういう基礎的な部分で間違いを犯す以上、全幅の信頼は出来ない、と言う事に他ならない(ちなみに、同じようなミスはPython本でもよう見かける)。
プログラミング経験者なら、下手な本を買うよか、MDNをJavaScriptのリファレンスとして調べながら使った方が遥かにいいだろう。コーディングスタイルにしてもMDNに則った方が遥かにマシ、とは言える。
後は大体、#1氏の言う通りだと思う。ちょっとだけ付け足そう。
アロー関数式はPythonで言うトコのラムダ式だ。JavaScriptのアロー関数式はPythonのラムダ式よか強力で、良く使う。Pythonのラムダ式に慣れてない、あるいはあまり使わなかった、と言うのなら、その辺復習する事をオススメする。
あとは#1氏が
配列操作(map/filter)
と書いてたが、もうちょっと付け足しておく。
この手の操作を制御抽象(実は日本語が存在しなく、英語ではControl Abstractionと呼ぶ)と呼ぶが、6種類(検索/ソーティング/フィルタリング/マッピング/結合/計数)くらいあって、JavaScriptに限らず、モダンなプログラミング言語だと大体備えていて良く使うものだ。
以下にPythonとJavaScriptの対応表を挙げる。
Pythonだとリストの内包表記一本槍なところがあるんだけど、JavaScriptは用途別に分かれてる、ってのが大きな違いとなる。
あとは、集合(Pythonのset/JavaScriptのSet)も押さえておいた方がいいだろう。これは実の事言うと、ハッシュテーブル(Pythonの辞書/JavaScriptのMap)のキーの副産物なんだけど、使いこなせれば色々と便利になるだろう。自信がない場合は、Python辺りで復習しても良いだろう。
いずれにせよ、この6つの制御抽象を自在に使いこなしてプログラミング出来るようにしよう。これはJavaScriptに限らず、モダンなプログラミング言語だと共通して持っている重要な概念でもある。
あと、Battery IncludedのPythonからJavaScriptに移動して驚く事だろう事は、JavaScriptがNo Batteryだ、って事だ。Pythonが備えていた標準ライブラリ的なモノがJavaScriptには一切ない、に等しい。
例えばPythonだとzipなんかが大変便利で、駆使してたと思うんだけど、そういう便利ツールはJavaScriptは備えていない。結果、Python的な快適さを求めると、ある程度自作していかなきゃならない、って事になる(zipは長い間、ECMAScript策定委員会に提案され続けてるんだけど、棄却されまくってる・笑)。
例えば次のようにね。
JavaScript
1function zip(array1, ...moreArrays) { 2 function minLen() { 3 return Math.min(...[array1, ...moreArrays] 4 .map((element) => element.length)); 5 } 6 function makeSlicedArrays(i) { 7 return [array1, ...moreArrays] 8 .map((element) => element.slice(0, i)); 9 } 10 return ((i) => 11 makeSlicedArrays(i) 12 .reduce( 13 (accumulator, currentValue) => 14 currentValue.map((element, i) => [...accumulator.at(i), element]), 15 [...new Array(i)].fill([]), 16 ))(minLen()); 17}
そんなカンジかね。
あとは#1氏の言うまんま、だと思う。
#3
総合スコア86670
投稿2026/07/27 05:02
・TypeScriptはJavaScriptの拡張言語であるため、JavaScriptの知識が前提になると聞きました。
・一方で、「JSの基礎を軽く触ったらすぐにTSに入ったほうが効率が良い」「最初からTSで書いて慣れたほうが良い」という意見も見かけました。
どちらも正しいでしょう。「JavaScriptの知識が前提」と「JSの基礎を軽く触ったら」は、言いたいことは同じだと思います。JavaScriptの中級者にならなくてもTypeScriptを学んでOK。もっというと、初心者までいかずとも入門者を卒業くらいでいいかと思います。
具体的には、#1の方の回答の通りかと思います。 「Pythonは経験あり」の程度が分かりませんが、リファレンス見ながらでいいので、自分でゼロから考えて書けるのなら、JavaScriptチュートリアルとかを数日だけ見ればいいと思います。
「書き方が違うけど、これはPythonだとこれことだな」と分かることもあれば、「この概念は見たことない」というものもあるかと思います。知らない概念はいずれ学ぶ必要がありますが、JavaScriptのテキストで学ぶのか、TypeScriptのテキストで学ぶのかはどちらでもいいと思います。
JavaScriptのテキストで理解できればいいし、理解出来なければ引き続き学んでもいいし、後回しにしたければ「～～の理解」をバックログに積んてTypeScriptに進めばいいと思います。実例に触れながら理解できる時が来るでしょう。
非同期処理について補足します。
ブラウザで動くJavaScriptだと非同期処理が必要になることが多いです。ブラウザ上でのスクリプトはナノとかマイクロ秒単位で動きますが、途中でウェブサーバーに問い合わせる場合は、早くてミリ秒単位とか場合によっては数十秒掛かります。その間にほかの処理をせずに応答を待ち続けるのが同期処理、ウェブリクエストを投げて応答が返るまで他の処理をしていて、応答が返ったら、受け取った後の処理を始めるのが非同期処理です。非同期処理の書き方はいろいろあり、書きやすく進化してきましたので、古いテキストを見ると古い書き方になっているでしょう。
このサイトでも、「この部分のコードはどのタイミングで実行されるのか？」を勘違いして悩んでいる質問がそこそこありましたので、慣れないと難しいという事でしょうね。
非同期処理自体はブラウザ上のJavaScriptで使われるだけじゃなくて、言語や環境を問わず、時間スケールの異なる処理が途中で挟まるような処理をどうやって進めるかの一つのやり方です。同時に非常に多数の処理を実行するときにも使われます。
#4
総合スコア1
投稿2026/07/27 09:42
はじめまして。
結論から言うと、現在のスキルセット（Python経験あり・インフラ経験あり）であれば、JavaScriptを何ヶ月も深掘りしてからTypeScriptへ進む必要はないと思います。
ただし、TypeScriptはJavaScriptとは別の言語というより、JavaScriptに型システムを追加した拡張言語です。そのため、JavaScriptの基本的な動作や考え方を理解していないと、TypeScript学習時につまずきやすい部分があります。
おすすめの学習順序としては、
JavaScriptの基礎を理解する
→ TypeScriptを学ぶ
→ React / Next.jsなどのフレームワークで実践する
という流れが良いと思います。
ただし、JavaScriptをすべて完璧に覚えてからTypeScriptへ進む必要はありません。TypeScriptを書くために必要な範囲に絞って学習するのが効率的です。
JavaScriptで最低限押さえておきたい内容は以下です。
- 変数（let / const）
- 基本的なデータ型
- 配列・オブジェクト操作
- 関数
- アロー関数
- スコープの考え方
- 分割代入
- map / filter / reduce
- Promise
- async / await
- import / export（モジュール）
- thisの基本的な挙動
特に Promise、async / await は重要です。
実際のWeb開発では、API通信やデータ取得処理など非同期処理を扱う場面が非常に多いため、ここを理解しているかどうかでTypeScriptやフロントエンド開発の理解度が大きく変わります。
その後、TypeScriptでは以下を重点的に学ぶと実務につながりやすいです。
- 基本型（string / number / booleanなど）
- interface
- type
- union型
- 型推論
- generics
- utility types
- APIレスポンスの型定義
Python経験があるのであれば、文法面で大きく苦労する可能性は低いと思います。
むしろ最初に戸惑いやすいのは、JavaScript特有の部分です。
- 動的型付けの考え方
- undefined / nullの扱い
- 非同期処理
- ブラウザ上でコードが動く仕組み
このあたりを理解すると、TypeScriptの「なぜ型を書くのか」「型があると何が嬉しいのか」が実感しやすくなります。
私なら以下のような流れで学習します。
- JavaScript基礎を短期間で学ぶ（1〜2週間程度）
↓
- 同じコードをTypeScriptで書き直してみる
↓
- React + TypeScriptで小さなアプリを作る
↓
- API連携、認証、データベース接続など実践的な内容へ進む
最初に作るものとしては、
- Todoアプリ
- 簡単な管理画面
- APIからデータ取得するダッシュボード
などがおすすめです。
「最初からTypeScriptで始めても良い」という意見もありますが、初心者の場合、エラーが発生した際に
「これはJavaScriptの仕様による問題なのか」
「TypeScriptの型エラーなのか」
を切り分けるのが難しくなることがあります。
そのため、JavaScriptの基礎を短期間で理解してからTypeScriptへ進むルートが、結果的には挫折しにくいと思います。
インフラ経験がある方であれば、TypeScriptの「事前に問題を発見できる」「大規模開発で安全に保守できる」というメリットは比較的理解しやすいと思います。
焦ってTypeScriptだけを覚えるよりも、JavaScriptの仕組みを理解した上でTypeScriptを使えるようになる方が、実務では強いスキルになります。
あくまで私個人の意見ですが、少しでも参考になれば幸いです。
あなたの回答
tips
プレビュー