摘要：版本記錄針對版本的特性作專門的實例，希望能加深理解。這種情況下添加類型屬性被間接初始化了例如構造函數中調用一個方法，更改了屬性的值。這種情況下我們可以使用顯式賦值斷言修飾符號來幫助類型系統識別類型。

針對ts 2.7版本的特性作專門的實例，希望能加深理解。實例github地址 官方日志文檔

const Foo = "Foo";
const Bar = "Bar";

let x = { // 2.7版本之前，x的類型為{[x:string]:string|number},現在為 {[Foo]: number;[Bar]: string;}}
    [Foo]: 100,
    [Bar]: "hello",
};

let a = x[Foo]; // has type "number"
let b = x[Bar]; // has type "string"

ES6 引入的 Symbol 機制,Symbol是js的第七種數據類型,可以產生獨一無二的值，可以用來保證每個屬性的名字都是獨一無二,從根本上防止屬性名的沖突。結合ts，我們可以這樣聲明一個symbol，const Foo: unique symbol = Symbol()

unique symbol 類型必須由 const 關鍵字聲明

// Error! "Bar" isn"t a constant.
let Bar: unique symbol = Symbol();

引用賦值一個 unique symbol 類型的值時候使用 typeof 操作符

// let Baz = Foo // 這樣的話 Baz 的類型為symbol
let Baz: typeof Foo = Foo // 類型為unique symbol
// 在class里面使用 `unique symbol` 定義類的靜態屬性(不能用在類屬性) 時，
// 需要使用 `readonly static` 關鍵字來聲明
class C {
    static readonly StaticSymbol: unique symbol = Symbol();
}

當Symbol + const時，值的類型自動判斷為unique symbol

// let SERIALIZE = Symbol("serialize-method-key"); SERIALIZE 類型為symbol
const SERIALIZE = Symbol("serialize-method-key");  // SERIALIZE 類型為unique symbol

接口中的計算屬性名稱引用必須引用類型為文本類型或 "unique symbol"

interface Serializable {
   // [("serialize-method-key")](obj: {}): string; //error
   [SERIALIZE](obj: {}): string;
}

class JSONSerializableItem implements Serializable {
   //  error 只能用引入的SERIALIZE來作屬性的名稱
   // ["serialize-method-key"](obj: {}) {
   //     return JSON.stringify(obj);
   // }
   [SERIALIZE](obj: {}) {
       return JSON.stringify(obj);
   }
}

另外，兩個unique symbol類型的值不能互相比較(當然除非其中一個值的類型為用 typeof 另外一個值)

TypeScript 2.7引入了一個新的控制嚴格性的標記 --strictPropertyInitialization

現在，如果開啟 strictPropertyInitialization，我們必須要確保每個實例的屬性都會初始值，可以在構造函數里或者屬性定義時賦值。

class StrictClass {
    foo: number;
    bar = "hello";
    baz: boolean; 
    // error,Property "baz" has no initializer and is not definitely assigned in the constructor
    constructor() {
        this.foo = 42;
    }
}

有兩種情況下我們不可避免該error的產生：

該屬性本來就可以是 undefined 。這種情況下添加類型undefined

屬性被間接初始化了（例如構造函數中調用一個方法，更改了屬性的值）。這種情況下我們可以使用 顯式賦值斷言 (修飾符號 !) 來幫助類型系統識別類型。后面具體介紹它，先看下代碼中怎么使用：

class StrictClass {
    // ...
    baz!: boolean;
    // ^
    // 注意到這個!標志
    // 代表著顯式賦值斷言修飾符
}

盡管我們嘗試將類型系統做的更富表現力，但我們知道有時用戶比TypeScript更加了解類型

跟上面提到的類屬性例子差不多，我們無法在給一個值賦值前使用它，但如果我們已經確定它已經被賦值了，這個時候類型系統就需要我們人的介入

let x: number;
initialize();
console.log(x + x);
//          ~   ~
// Error! Variable "x" is used before being assigned.

function initialize() {
    x = 10;
}

添加 ! 修飾:let x!: number,則可以修復這個問題

我們也可以在表達式中使用!,類似 variable as string和 variable :

let x: number;
initialize();
console.log(x! + x!); //ok

function initialize() {
    x = 10;
}

這一塊中文官網花了挺長篇幅來講這個內容，我也是實踐過才明白講的是什么，需要理解 __esModule 標記是做什么的、es6模塊經過ts轉換成commonjs是怎么的、 如何保持與老式代碼( CommonJS/AMD/UMD)的互通性

先說一下 --esModuleInterop 的作用：

默認開啟allowSyntheticDefaultImports（那是肯定的，我們需要它來實現默認導入的功能）

命名空間導入不允許被調用或者構造,需要改成默認導入

import * as express from "express";
// error 正確的實現導入方式應該是下面這種

import express from "express";
express();

注意: 我們強烈建議開啟esModuleInterop,不管在新代碼或者是老代碼上。但該模式下會可能對已有的代碼產生破環，對已有的命名空間導入(import * as express from "express"; express();)改成默認導入(import express from "express"; express(); )

讓我們更深入理解，在 --esModuleInterop 下，ts對 import * 和 import default兩種導入方式用兩個helpers __importStar and __importDefault做分別處理。

構建前的代碼：

import * as foo from "foo";
import b from "bar";
const a = "newM"
export default a

構建后的代碼：

"use strict";
var __importStar = (this && this.__importStar) || function (mod) {
    if (mod && mod.__esModule) return mod;
    var result = {};
    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
    result["default"] = mod;
    return result;
}
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
}
exports.__esModule = true;
var foo = __importStar(require("foo"));
var bar_1 = __importDefault(require("bar"));
const a = "newM";
exports.default = a;

這樣做的結果是，我們新的代碼不管是通過ts，Babel或Webpack來構建，都能通過 __esModule 來判斷是否為es模塊，如果無__esModule，則創建含default的對象保存模塊，這樣就完成我們要的默認導入功能，同時保持對老的庫的支持

[number, string, string]類型的值 不可賦值 [number, string] 類型的值了。

[number, string]類型等同于下面的 NumStrTuple聲明：

interface NumStrTuple extends Array {
    0: number;
    1: string;
    length: 2; // using the numeric literal type "2"
}

NumStrTuple 代表類型為固定長度為2,[0]為number類型,[1]為string 類型的數組

如果不希望固定寬度，只需要最小長度，可以這樣：

interface MinimumNumStrTuple extends Array {
    0: number;
    1: string;
}

// 現在能正常判斷obj的類型了，而不是之前的 {}
const obj = test ? { text: "hello" } : {};  // { text: string } | { text?: undefined }
const s = obj.text;  // string | undefined

// { a: number, b: number } |
// { a: string, b?: undefined } |
// { a?: undefined, b?: undefined }
let obj2 = [{ a: 1, b: 2 }, { a: "abc" }, {}][0];

declare function f(...items: T[]): T; 

// { a: number, b: number } |
// { a: string, b?: undefined } |
// { a?: undefined, b?: undefined }
let obj3 = f({ a: 1, b: 2 }, { a: "abc" }, {});

in 操作符 和 instanceof 運算符 更好用了（就是那么簡單）

--watch 會在重新編譯后清空控制臺
--pretty 更好地展示錯誤信息

看圖:

完。參考：ts官方