5分前にType Scriptを踏んでピットを踏みます.

前言
最近はType Scriptを勉強していますが、Type Scriptの公式文書の中の5分間の手始めType Scriptの指導教程には多くの新米が理解しにくいところがありますので、メモしてください.
私が使っているバージョンは
npm [email protected]
今後バージョンが異なるかもしれません.
Type Scriptとは何ですか
ウィキペディアでは「Type Scriptはマイクロソフトが開発した自由とオープンソースのプログラミング言語です.JavaScriptの厳密なオーバーセットで、オプションの静的タイプとベースのプログラミングを加えました.」
名前から私達はType ScriptとJavaScriptの違いがタイプです.Type ScriptはJavaScriptより多くなりました.このタイプの検査機能はJavaScriptがダイナミックなタイプ、静的な作用のある言語であることを知っています.Type Scriptの方が静的なタイプの言語に似ています.
どのようにType Scriptを実行しますか?
ブラウザはjs、html、css言語しか実行できません.どのようにブラウザで実行しますか?覚えておいてください.
ブラウザはjsを実行できます.
ブラウザはtsを実行できません.
tsをjsに変えてこそ、ブラウザで実行できます.
tscはtsをjsに転化します.
tscは何ですか?どうやって取得しますか?npmを使えるようにしてインストールします.
npm install-g typescript
tscとts-nodeの二つの命令が得られます.
最初のTypeesScriptファイルを構築する
5分前のType Scriptの文書で、私達は以下のコードをgreeter.tsファイルに入力することを要求します.

function greeter(person) {
    return "Hello, " + person;
}

let user = "Jane User";

document.body.innerHTML = greeter(user);

上でブラウザはtsを実行できないと言っていますが、document.body.inners HTMLはブラウザで実行する必要がありますので、とりあえずtsファイルをjsファイルに変換したいです.これは比較的に面倒です.

function greeter(person) {
    return "Hello, " + person;
}

let user = "Jane User";

console.log(greeter(user));

そして
ts-node greeter.ts
端末に直接出力結果を出すことができます.
タイプコメント
上のコードの中で、私達はまだtsとjsの違いが見えません.下で上のコードを変えます.

function greeter(person: string) {
    return "Hello, " + person;
}

let user = "Jane User";

console.log(greeter(user));

パラメータの後にコロンを付けてタイプを加えます.これはパラメータに禁固を加えるのと同じです.入力したパラメータが文字列のタイプではない時に.

function greeter(person: string) {
    return "Hello, " + person;
}

let user = 123;

console.log(greeter(user));

コンパイルしてjsに変換するとエラーが発生します.以下の通りです.
greeter.ts(7,21):error TS 2345:Agment of type'number'is not assignable to parameter of type'string'
このようにあなたが間違っていることを発見した時は、運行からブラウザの段階まで繰り上げてコンパイルの段階に着きました.
また、パラメータがundefinedであれば、タイプチェックはエラーが発生しません.例えば、

function greeter(person: string) {
  return "Hello, " + person;
}

let user = undefined;

console.log(greeter(user));

運転後は正しく出力されます.
ハロー、undefined
インターフェース
javaやc萼を習ったことがある人はこれをよく知っているかもしれません.つまり、一つのオブジェクトを規定したのに相当していくつかの属性が含まれています.例えば、公式文書が与えた例は、もし私たちの対象が規則に合わないなら、一つの属性を少なく書くべきです.

interface Person {
    firstName: string;
    lastName: string;
}

function greeter(person: Person) {
    return "Hello, " + person.firstName + " " + person.lastName;
}

let user = { firstName: "Jane"};

console.log(greeter(user));

間違えます
greeter.ts(12,21):error TS 2345:Armgment of type'{first Name:string]'s not assignable to parameter of type'Person'
Property'lastName'is missing in type'{first Name:string;}'
属性を多く書いたら

interface Person {
  firstName: string;
  lastName: string;
}

function greeter(person: Person) {
  return "Hello, " + person.firstName + " " + person.lastName;
}

let user = { firstName: "Jane", lastName: "User" , m:'ss'};

console.log(greeter(user));

まだ正常に動作します.
クラス
Type Scriptのクラスの作成はES 6に似ていますが、publicのキーワードが一つ増えています.javaを熟知している学生は知っているかもしれません.しかし、tsの中でこのpublicの具体的な役割は何ですか?公式文書の例で見られます.

class Student {
    fullName: string;
    constructor(public firstName, public middleInitial, public lastName) {
        this.fullName = firstName + " " + middleInitial + " " + lastName;
    }
}

interface Person {
    firstName: string;
    lastName: string;
}

function greeter(person : Person) {
    return "Hello, " + person.firstName + " " + person.lastName;
}

let user = new Student("Jane", "M.", "User");

console.log(greeter(user));

実際には

class Student {
  fullName: string;
  firstName: string;
  middleInitial: string;
  lastName: string;
  constructor(firstName, middleInitial, lastName) {
    this.firstName = firstName
    this.middleInitial = middleInitial
    this.lastName = lastName
    this.fullName = firstName + " " + middleInitial + " " + lastName;
  }
}

interface Person {
  firstName: string;
  lastName: string;
}

function greeter(person: Person) {
  return "Hello, " + person.firstName + " " + person.lastName;
}

let user = new Student("Jane", "M.", "User");

console.log(greeter(user));

後記
以上は5分間の上級Type Scriptの解読です.私も引き続き勉強しています.特にjsと比べて厳しいです.jsの運行前にエラーを発見できます.コードはもっとバグが発生しにくいです.jsがダイナミックタイプから静止タイプに変化しているように見えますが、上記のように書いている時もundefinedのタイプは検査されていません.だからまだ完璧にしているかもしれませんが、Type Scriptの開発がより快適であると認めざるを得ません.