プロジェクトや注意事項はじめの基本的なタイプを活字体

の実装にソースからファイルを活字体

エグゼキュータ	ステップ	説明
TSC	1.活字体ソース - >活字体AST	TSCは、TS AST（抽象構文木）にファイルをtsでます
TSC	2. ASTは、型チェッカーによってチェックされています	ASTの型チェックのためのTSCの型チェッカー
TSC	3.活字体のAST - > Javascriptのソース	（ES3 / 5/6であってもよい）TS AST JSソースコードにTSC
JS（ブラウザ/Node.js）	4. Javascriptのソース - > JavascriptのAST	ランタイムJS ASTにJS JSのソースコード
JS（ブラウザ/Node.js）	5. JavascriptのAST - >バイトコード	JS JS ASTは、実行する準備ができて、バイトコードに実行されます
JS（ブラウザ/Node.js）	6.バイトコードは、ランタイムによって評価されます	バイトコードランタイムを実行しているのJS JS

TSCは1-3である処理ステップ、処理ステップ4-6ランタイムJSは、ブラウザがあってもよいNode.js.

上記の手順は知っているかもしれませんから、TSCの型チェックは、JSのソースへのTSのASTの前に行われ、それがTS ASTは、JSのソースから変換する場合と言うことです、型チェックが行われていません。TS ASTのためのタイプを確認し、第二のステップということ。

TSは、システムの種類、型チェックのためにのみ有用強く型付けされたメカニズム、JSの出力に影響はありませんが、JSの増加は、ソースファイルの種類を汚染しないことを意味します。

tsconfig.jsonについて

次のように-initは、TSCによりtsconfig.jsonファイルを作成することができます。

{
  "compilerOptions": {
    "target": "es2015",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019' or 'ESNEXT'. */
    "module": "commonjs",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
    "lib": ["es2015"],                             /* Specify library files to be included in the compilation. */
    "sourceMap": true,                     /* Generates corresponding '.map' file. */
    // "outFile": "./",                       /* Concatenate and emit output to single file. */
    "outDir": "dist",                        /* Redirect output structure to the directory. */
    "strict": true,                           /* Enable all strict type-checking options. */
    "noImplicitAny": true,                 /* Raise error on expressions and declarations with an implied 'any' type. */
    "alwaysStrict": true,                  /* Parse in strict mode and emit "use strict" for each source file. */
    "esModuleInterop": true                   /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
  }
}

ここでは主に、いくつかの一般的な構成を表示するには：

構成プロパティ	説明
含める	TSCは、どこのファイルTSを見つけるように言わ
LIB	TSC現在のランタイムAPIがすでに存在して知らせる、通常含む：ES5、新しいメソッドの新しいアレイ法、ES6をバインド
モジュール	TSCは、JSファイル、通常CMJ、CMD、ES6などの標準モジュールにTSファイルを教えてくれます
OUTDIR	ファイルには、TSCがどのディレクトリに変換伝えます
厳密	TSCは、厳密な型チェックするかどうかを教えてくれ
ターゲット	TSCは、JS、通常ES3、ES5、ES6、などのバージョンを伝えるためにTSを変換します
noImplicitAny	未定義のタイプ、すなわち、暗黙の型が存在することを許可するかどうか。TSCは、自分自身のタイプを推測しません
alwaysStrict	TSCは、各JSファイル出力での使用に厳しい声明をもたらします

tslintについて

次のように-initは、デフォルトtslint.jsonファイルのtslintを作成することができます。

{
    "defaultSeverity": "error",
    "extends": [
        "tslint:recommended"
    ],
    "jsRules": {},
    "rules": {},
    "rulesDirectory": []
}

{タイプ}

変数タイプに設定されている場合、{}は、この変数の値がnullと未定義以外の任意の値であってもよいことを意味します。

let a:{} = 1;
let b:{} = Symbol('b');
let c:{} = null; // Type 'null' is not assignable to type '{}'.
let d:{} = undefined; // Type 'undefined' is not assignable to type '{}'.

オブジェクトタイプ

場合は、この変数の値は、文字列、数字、記号、ヌル、未定義、ブール値以外の値であり得ることを意味するオブジェクト型への変数、。

let a:object = new Date();
let b:object = function(){};
let c:object = [];
let d:object = new RegExp('');
let e:object = true; // Type 'true' is not assignable to type 'object'.
let f:object = Symbol(); // Type 'symbol' is not assignable to type 'object'.
let g:object = 1; // Type '1' is not assignable to type 'object'.
let h:object = '1'; // Type '"1"' is not assignable to type 'object'.

オブジェクトの種類

{}と同じタイプ。

値	{}	オブジェクト	オブジェクト
{}	はい	はい	はい
[ 'A']	はい	はい	はい
関数（）{}	はい	はい	はい
新しいString（ 'A'）	はい	はい	はい
'A'	はい	番号	はい
1	はい	番号	はい
シンボル（）	はい	番号	はい
真	はい	番号	はい
ヌル	番号	番号	番号
未定義	番号	番号	番号

[]タイプ

変数は[]型として宣言された場合、空の配列でなければならない変数の値を表します。暗黙の宣言は[]である場合、それは要素のタイプは、値の、すなわち、任意のタイプのいずれかであることを示します。以下のような：

let a:[] = [];
a = [1]; // Type '[number]' is not assignable to type '[]'.
let b = []; // 隐式声明b为数组，元素类型是any类型
b.push(1);
b.push(null);

タプルタイプ

このタイプは、アレイタイプから継承されたサブアレイ型です。タプル型配列は、明示的要素の種類、及び不変配列の長さを宣言しなければなりません。以下のような：

// 声明定长的数组
let arr: [string,number,boolean] = ['a',2,true];

// 二维数组的声明
// 分步解释：
// let data: number[] 表示声明一个元素为数字的数组
// let data: [][] 表示声明一个元素为空数组的数组
// let data: [number, number][] 表示声明一个元素为两个元素的tuples类型的数组，且tuples的两个元素必须都为number类型
// let data: [number, number?][] 表示数组的第二个元素可选
let data: [number, number?][] = [[1,2],[3],[4,5]];

// 声明不定长数组，且指定第一个元素的类型，其他元素类型任意
let data1: [string,...any[]] = ['11','s',32];

列挙型

文字列へのマッピング文字列へのデジタルマッピングまたは文字列の定義：列挙型は、主に2つのタイプのトランザクションを扱います。TSは、自動的にデフォルトで0から出発して、列挙型の各メンバ数にマッピングされただけでなく、のような明示的に定義された数、を決定する開始位置です。

// 默认从0开始
enum lang {Chinese, English, Russian}; 
let a = lang.Chinese;
console.log(a, lang.English, lang.Russian); // 0, 1, 2
// 定义从3开始
enum lang {Chinese=3, English, Russian}; 
let a = lang.Chinese;
console.log(a, lang.English, lang.Russian); // 3, 4, 5
// 自定义或者自动赋值
enum lang {Chinese=3, English=6, Russian}; 
let a = lang.Chinese;
console.log(a, lang.English, lang.Russian); // 3, 6, 7

など、列挙型がTSに変換されて形成参照してください。

var lang;
(function (lang) {
    lang[lang["Chinese"] = 3] = "Chinese";
    lang[lang["English"] = 9] = "English";
    lang[lang["Russian"] = 10] = "Russian";
})(lang || (lang = {}));
;

我々は、次のような文字列によってデジタルにデジタル・ストリング、アクセスを介してアクセスすることができます。

console.log(lang['English'], lang[lang.English]); // 9 English

読み取り専用修飾子

オブジェクトの属性は読み取り専用と宣言され

let a: {a:string, readonly b:number} = {a:'2', b:3};
a.b = 4; // Cannot assign to 'b' because it is a read-only property.

読み取り専用として配列を宣言します

let as: readonly number[] = [1,2,3];
as.push(2); // Property 'push' does not exist on type 'readonly number[]'.
as.concat(3); // concat函数不会对原数组修改，而是返回新的数组，所以此处合法。

// 还可以这样声明
let arr: ReadonlyArray<string> = ['2'];
arr.push('3'); // Property 'push' does not exist on type 'readonly string[]'.
// 或者
let arr: Readonly<string[]> = ['22'];

読み取り専用クラス宣言を属性。読み取り専用属性クラスは、宣言の時に割り当てることができ、コンストラクタや代入は、他の場所で割り当てることが許可されていません。以下のような：

class Foo{
    readonly bar = 1;
    readonly baz:string;
    constructor(){
        this.baz = 'hello';
    }
    setBaz(value:string){
        this.baz = value; // Cannot assign to 'baz' because it is a read-only property.
    }
}
console.log(new Foo().baz);

組み合わせのタイプ

時々変数の値は、次のようなこれらの型を、この変数に設定し、設定することができるケースの種類のため、他のタイプの特定のタイプを取るために必要とされ得ます。

let prop: string|number = 3;
prop = '3'; // 可以被赋值，因为prop可以为string和number类型中的一个

// 数组里可以是字符串也可以是数字
type StringOrNumber = string|number;
let a: StringOrNumber[] = []; // 或者直接这样：let a: (string|number)[] = [];
a.push(1);
a.push('a');
a.push(true); // 类型错误，不可以有布尔类型

type Cat = {name:string, purrs:boolean};
type Dog = {name:string, barks:boolean, wags:boolean}
type CatOrDogOrBoth = Cat|Dog;
let cat: CatOrDogOrBoth = {name: 'John', purrs: true};
// 类型错误 {name: 'John', barks: false} 不属于Cat和Dog中的任何一个类型
let cat2: CatOrDogOrBoth = {name: 'John', barks: false}; 
// 类型错误，同上
let cat3: CatOrDogOrBoth = {name: 'John', wags: false};
// 类型错误， 同上
let cat4: CatOrDogOrBoth = {barks: true, wags: false};
// 属于Cat类型，因为没有barks属性，即不是Dog类型，且完全拥有Cat类型定义的所有属性
let cat5: CatOrDogOrBoth = {name: 'John', purrs: true, wags: false};
// 既是Cat类型也是Dog类型
let cat6: CatOrDogOrBoth = {name: 'John', barks: false, wags: false, purrs:false}