ki-hi-ro.com WEB制作フリーランスエンジニア
  • Service
    • WEBサイトの更新サポート
    • 新規サイトコーディング
  • Introduce
    • メッセージ
    • 自宅兼事務所
    • Twitter
  • Blog
    • 技術ブログ
    • 学習ブログ
    • 雑記ブログ
  • Others
    • スケジュールのお知らせ
    • お問い合わせ
    • WEBに関する無料相談
  • Top
  • Service
  • Introduce
  • Blog
  • Contact

TypeScriptを学んでいきます

最近、Workshipからの求人メールでTypeScriptの文字をよく見かけるので、学んでみたいと思います。

こちらの書籍を購入しました。

早速、本日学んだことをアウトプットしていきます。

学んだこと

TypeScriptとは

TypeScriptは、JavaScriptのスーパーセット(機能を拡張したもの)です。

ECMAscriptとは

JavaScriptの仕様を定めているのがECMAscript(エクマスクリプト)です。

tscコマンド

tscコマンドはTypeScript Compilerの略で、TypeScriptをJavaScriptに変換するためのコマンドです。例えば、以下のように入力するとhello.tsがhello.jsに変換されます。

tsc hello.ts

TypeScriptは、そのまま実行できないためtscコマンドでJavaScriptに変換する必要があります。SassとCSSの関係と同じです。Sassファイルはそのままではブラウザが認識できないので、CSSにコンパイルする必要があります。

型宣言

TypeScriptでは、数字か文字列か・・といった”型”を宣言します。

例えばこちらのコード(ファイル名は、sum.ts)を、tsc sum.tsでコンパイルすると・・・

function sum(a: number, b: number) {
  return a + b
}

console.log(sum(1, 2));

型チェックが行われた後に、下記のようなsum.jsに変換されます。

function sum(a, b) {
    return a + b;
}
console.log(sum(1, 2));

そしてターミナルで、node sum.jsを実行すると、3と表示されます。

環境構築

環境構築に関しては、こちらの記事が分かりやすかったので、参考にしました。

TypeScriptコンパイラをインストールして、実際にtsファイルをjsファイルに変換しました。

学習用リポジトリ

こちらのGitHubにstudy-typescriptという名前で学習用リポジトリを作成しました。

英語の公式サイト

TypeScriptの英語の公式サイトからも、情報をインプットしていきたいと思いました。

今後の流れ

今後は、chapter2の基本的な文法をさらっと読んで、少しだけコードを書いて試していきます。その後、chapter3のnode.jsを使用したアプリケーション作成に入っていきます。楽しみです。

関連記事

2022.05.15 TypeScript TypeScript 学習 part10
2022.05.12 TypeScript TypeScript 学習 part9
2022.05.01 TypeScript TypeScript 学習 part8
2022.04.28 TypeScript TypeScript 学習 part7
2022.04.25 TypeScript TypeScript 学習 part6
2022.04.24 TypeScript TypeScript 学習 part5

サービス一覧

  • WEBサイトの更新サポート
  • 新規サイトコーディング

自己紹介

  • メッセージ
  • 自宅兼事務所
  • Twitter

ブログ

  • 技術ブログ
  • 学習ブログ
  • 雑記ブログ

その他

  • スケジュールのお知らせ
  • お問い合わせ