TypeScript入門｜JavaScriptとの違いと基本文法

JavaScriptに型をプラス！TypeScriptで安全で大規模な開発を始めよう！

TypeScriptとは？JavaScriptとの違いを徹底解説

TypeScriptは、JavaScriptに型定義を追加したスーパーセットです。Microsoftによって開発され、大規模なJavaScriptアプリケーション開発をより効率的に、そして安全に進めるために設計されました。

JavaScriptは動的型付け言語であるため、実行時まで型エラーが検出されないことがあります。一方、TypeScriptは静的型付け言語であり、コンパイル時に型チェックを行うため、開発段階でエラーを発見しやすくなります。

TypeScriptを使うことで、コードの可読性、保守性、信頼性が向上し、大規模プロジェクトでの開発効率を大幅に改善することが期待できます。

以下に、JavaScriptとTypeScriptの簡単な比較表を示します。

TypeScriptの基本文法

TypeScriptの基本的な文法をいくつか紹介します。

変数、関数、オブジェクトのプロパティなどに型を指定することができます。

let message: string = 'Hello, TypeScript!';
let count: number = 10;
let isActive: boolean = true;

オブジェクトの構造を定義するために使用します。

interface Person {
  name: string;
  age: number;
}

let person: Person = {
  name: 'Taro',
  age: 30,
};

オブジェクト指向プログラミングのクラスをサポートします。

class Animal {
  name: string;

  constructor(name: string) {
    this.name = name;
  }

  sayHello() {
    console.log(Hello, my name is ${this.name});
  }
}

let dog = new Animal('Pochi');
dog.sayHello();

関数の引数と戻り値に型を指定することができます。

function add(x: number, y: number): number {
  return x + y;
}

console.log(add(5, 3)); // Output: 8

型をパラメータ化することで、再利用性の高いコードを書くことができます。

function identity<T>(arg: T): T {
  return arg;
}

let myString: string = identity<string>('hello');
let myNumber: number = identity<number>(42);

TypeScriptの環境構築

TypeScriptを使うためには、まず開発環境を構築する必要があります。

TypeScriptコンパイラや関連ツールをインストールするために、Node.jsとnpmが必要です。Node.jsの公式サイトからダウンロードしてインストールしてください。

npmを使ってTypeScriptをグローバルにインストールします。

npm install -g typescript

tsconfig.jsonファイルを作成して、コンパイラの設定を行います。

tsc --init

tsconfig.jsonファイルを編集して、ターゲットのJavaScriptのバージョンやモジュールシステムなどを設定します。

TypeScriptファイルをコンパイルして、JavaScriptファイルを生成します。

tsc your_file.ts

または、tsconfig.jsonファイルがあるディレクトリでtscコマンドを実行すると、プロジェクト全体のTypeScriptファイルがコンパイルされます。

参考リンク

• TypeScript
• Node.js

まとめ

TypeScriptは、JavaScriptの弱点を補い、大規模アプリケーション開発をより安全かつ効率的に進めるための強力なツールです。型定義、インターフェース、クラスなどの機能を利用することで、可読性、保守性、信頼性の高いコードを作成することができます。ぜひTypeScriptを導入して、より良い開発体験をしてみてください。