TypeScript

クラス継承はextendsキーワードで行う。

class Parent {}
class Child extends Parent {}

インターフェース (Interfaces) - サバイバルTypeScript-TypeScript入門

TypeScriptにはabstract修飾子があり抽象クラスを表現できます。

JavaScriptのオブジェクトとクラス - サバイバルTypeScript-TypeScript入門

avaやPHPなどの言語では、abstract修飾子を使って抽象クラスを定義できます。 抽象クラスは、直接インスタンスを作れないクラスのことです。JavaScriptに は抽象クラスを定義する構文はありません。

JavaやPHPなどの言語では、フィールドやメソッドにprivate, protected, publicを指定できます。JavaScriptでもprivateのようなプロパティを実現する ためにプライベートクラスフィールドという仕様が実験的に導入されはじめて はいますが、現状はJavaのようなアクセス修飾子はありません。

TypeScriptにはJava風のアクセス修飾子があります。TypeScriptのアクセス修 飾子については「クラス」をご覧ください。

プロトタイプベース - サバイバルTypeScript-TypeScript入門

• プロトタイプベースとはどういう考え方なのか？
• プロトタイプベースのJavaScriptは、クラスベースのPHPやJavaとどんなとこ ろが違う？
• なぜJavaScriptはプロトタイプベースを採用したのか？
• プロトタイプベースの利点は何か？

こういう疑問から始めるのはいいな。

オブジェクト指向プログラミング(OOP)では、オブジェクトを扱います。オブジェ クトを扱う以上は、オブジェクトを生成する必要があります。

しかし、オブジェクトの生成方式は、OOPで統一的な決まりはありません。言語 によって異なるのです。言語によりオブジェクト生成の細部は異なりますが、 生成方法は大きく分けて「クラスベース」と「プロトタイプベース」がありま す。

オブジェクト思考プログラミング言語ではクラス作成 → クラス.newしてインスタンスを作成して目的を達成する。 オブジェクトの素となるのがクラスだから、クラスベースと言う。

一方のJavaScriptのオブジェクト生成はプロトタイプベースです。プロトタイ プベースの特徴は、クラスのようなものが無いこところです。(あったとしても クラスもオブジェクトの一種だったりと特別扱いされていない)

プリミティブ型 (Primitive Types) - サバイバルTypeScript-TypeScript入門

振る舞いがないとはメソッドを持たないことです。

null.toString();

意図せずこのようにしてしまい実行時エラーになってしまった経験はあるかと 思います。これはnullがtoString()という振る舞いを持っていないことに起因 します。

とはいうもののJavaScriptにおいてプリミティブ型の多くはラッパークラスを 持っています。ラッパークラスを持つプリミティブ型の値はメソッド呼び出し があれば実行時に、対応するラッパークラスのインスタンスに変換されるため、 あたかもプリミティブ型が振る舞いを持つように見え、またそのように使うこ とができます。これはJavaを使われている方にとってはおなじみのAutoboxing というJavaScript の言語機能です。

• 改行できる
• 変数展開できる

  `console.log(`
hello
world
!!`);

TypeScriptのプロジェクトを作る時に必要なtsconfig.jsonにはこのany型の使 用を防ぐためのオプションとしてnoImplicitAnyがあります。既存の JavaScriptのプロジェクトをTypeScriptに置き換えていくのではなく、スクラッ チの状態からTypeScriptで作るのであればこの設定を入れるとよいでしょう。

オブジェクトが持つメソッドの定義の方法。

type A = {
  merge: (arg1: string, arg2: string) => string;
};
type B = {
  merge(arg1: string, arg2: string): string;
}

type Surname = string;
type GivenName = string;
type Person = {
  surname: Surname;
  givenName: GivenName;
}

const surname: Surname = 'Faure';
const givenName: GivenName = 'Gabriel';
const person: Person = {
  surname: givenName,
  givenName: surname
}

type SystemSupportLanguage = 'en' | 'tr' | 'it' | 'es';

? をつけると選択可。

type = Person = {
  surname: string;
  middleName?: string;
  givenName: string;
}

readonly

type Person = {
  readOnly surname: string;
  givenName: string;
};

入れ子までreadonlyにするわけではない。

const pokemon = {
  name: 'pikachu',
  no: 25,
  genre: 'mouse pokemon',
  height: 0.4,
  weight: 6.0,
};

オブジェクト型はプリミティブ型以外の総称。

const pikachu: object = {
  name: 'pikachu',
  no: 25,
  genre: 'mouse pokemon',
  height: 0.4,
  weight: 6.0,
};

const pokemon: object = new Pokemon{
  'pikachu',
  25,
  'mouse pokemon',
  0.4,
  6.0
};

const increment: object = i => i + 1;

⚠object型を与えた変数はその変数の持っているプロパティ、メソッドに対してアクセスできない。

pikachu.no;
// error

オブジェクトのプロパティは上書き可能。readonlyにするなどが必要。

ドキュメント。

ドキュメント。

interfaceの拡張性が高い。interfaceを使ったほうがよさそう。

Webで動かせるTypeScript。

Official documentation。

lspは、Language Server Protocol。 開発ツールと言語サーバープロセスの間における通信プロトコル…つまり実行前に解析することでエラーを検知できる。 検知した内容は共通の通信プロトコルで送信されるので、ソフトを問わずに知ることができる。

まず設定しておくと、インタラクティブに理解が進む。 WEBでどんな感じが試すのもいい。 https://www.typescriptlang.org/play

わかりづらいので本を変えた。 まず最初に読みやすいか確認するべきだな。 徐々にアプリを作っていく形式で、コードをどこに追加していいかわからないのは致命的だ。

本のが古いバージョンで最新ではコードが動かない。 ドラッグアンドドロップできない。 テストのパートが動かない。テストは別でやろう。

• 91, 165, 194