TypeScript 3.0 新功能介紹（二）

轉載

TypeScript 3.0 新功能介紹（二）

TypeScript 3.0 新功能介紹（二）

New unknown top type

TypeScript 3.0引入了一種新的頂級類型unknown。
unknown是任何類型安全的對應物。
任何東西均可以分配給unknown，可是unknown的東西除了自己以及任何沒有類型斷言或基於控制流的縮小以外的任何東西都不能分配。
一樣，若是沒有先斷言或縮小到更具體的類型，則不容許對unknown操做進行操做。具體看下官方給的例子

// In an intersection everything absorbs unknown

type T00 = unknown & null;  // null
type T01 = unknown & undefined;  // undefined
type T02 = unknown & null & undefined;  // null & undefined (which becomes never)
type T03 = unknown & string;  // string
type T04 = unknown & string[];  // string[]
type T05 = unknown & unknown;  // unknown
type T06 = unknown & any;  // any

// In a union an unknown absorbs everything

type T10 = unknown | null;  // unknown
type T11 = unknown | undefined;  // unknown
type T12 = unknown | null | undefined;  // unknown
type T13 = unknown | string;  // unknown
type T14 = unknown | string[];  // unknown
type T15 = unknown | unknown;  // unknown
type T16 = unknown | any;  // any

// Type variable and unknown in union and intersection

type T20<T> = T & {};  // T & {}
type T21<T> = T | {};  // T | {}
type T22<T> = T & unknown;  // T
type T23<T> = T | unknown;  // unknown

// unknown in conditional types

type T30<T> = unknown extends T ? true : false;  // Deferred
type T31<T> = T extends unknown ? true : false;  // Deferred (so it distributes)
type T32<T> = never extends T ? true : false;  // true
type T33<T> = T extends never ? true : false;  // Deferred

// keyof unknown

type T40 = keyof any;  // string | number | symbol
type T41 = keyof unknown;  // never

// Only equality operators are allowed with unknown

function f10(x: unknown) {
    x == 5;
    x !== 10;
    x >= 0;  // Error
    x + 1;  // Error
    x * 2;  // Error
    -x;  // Error
    +x;  // Error
}

// No property accesses, element accesses, or function calls

function f11(x: unknown) {
    x.foo;  // Error
    x[5];  // Error
    x();  // Error
    new x();  // Error
}

// typeof, instanceof, and user defined type predicates

declare function isFunction(x: unknown): x is Function;

function f20(x: unknown) {
    if (typeof x === "string" || typeof x === "number") {
        x;  // string | number
    }
    if (x instanceof Error) {
        x;  // Error
    }
    if (isFunction(x)) {
        x;  // Function
    }
}

// Homomorphic mapped type over unknown

type T50<T> = { [P in keyof T]: number };
type T51 = T50<any>;  // { [x: string]: number }
type T52 = T50<unknown>;  // {}

// Anything is assignable to unknown

function f21<T>(pAny: any, pNever: never, pT: T) {
    let x: unknown;
    x = 123;
    x = "hello";
    x = [1, 2, 3];
    x = new Error();
    x = x;
    x = pAny;
    x = pNever;
    x = pT;
}

// unknown assignable only to itself and any

function f22(x: unknown) {
    let v1: any = x;
    let v2: unknown = x;
    let v3: object = x;  // Error
    let v4: string = x;  // Error
    let v5: string[] = x;  // Error
    let v6: {} = x;  // Error
    let v7: {} | null | undefined = x;  // Error
}

// Type parameter 'T extends unknown' not related to object

function f23<T extends unknown>(x: T) {
    let y: object = x;  // Error
}

// Anything but primitive assignable to { [x: string]: unknown }

function f24(x: { [x: string]: unknown }) {
    x = {};
    x = { a: 5 };
    x = [1, 2, 3];
    x = 123;  // Error
}

// Locals of type unknown always considered initialized

function f25() {
    let x: unknown;
    let y = x;
}

// Spread of unknown causes result to be unknown

function f26(x: {}, y: unknown, z: any) {
    let o1 = { a: 42, ...x };  // { a: number }
    let o2 = { a: 42, ...x, ...y };  // unknown
    let o3 = { a: 42, ...x, ...y, ...z };  // any
}

// Functions with unknown return type don't need return expressions

function f27(): unknown {
}

// Rest type cannot be created from unknown

function f28(x: unknown) {
    let { ...a } = x;  // Error
}

// Class properties of type unknown don't need definite assignment

class C1 {
    a: string;  // Error
    b: unknown;
    c: any;
}

在JSX中支持 defaultProps

TypeScript 2.9及更早版本沒有利用JSX組件中的React defaultProps聲明。
用戶一般必須聲明屬性可選並在render中使用非null斷言，或者在導出以前使用type-assertions來修復組件的類型。
TypeScript 3.0添加支持JSX名稱空間中名爲LibraryManagedAttributes的新類型別名。
在用於檢查以其爲目標的JSX表達式以前，此助手類型定義組件的Props類型的轉換;
從而容許自定義，例如：如何處理提供的道具和推斷道具之間的衝突，如何映射推理，如何處理選項，以及如何組合來自不一樣地方的推理。
簡而言之，咱們可使用這種通用類型來模擬React的特定行爲，例如defaultProps，以及某種程度上propTypes。

export interface Props {
    name: string;
}

export class Greet extends React.Component<Props> {
    render() {
        const { name } = this.props;
        return <div>Hello ${name.toUpperCase()}!</div>;
    }
    static defaultProps = { name: "world"};
}

// Type-checks! No type assertions needed!
let el = <Greet />

**注意事項**

defaultProps上的顯式類型

默認ed屬性是從defaultProps屬性類型推斷出來的。
若是添加了顯式類型註釋，例如
static defaultProps：Partial <Props>;
編譯器將沒法識別哪些屬性具備默認值（由於defaultProps的類型包括Props的全部屬性）。
使用static defaultProps：Pick <Props，"name">;
相反，做爲顯式類型註釋，或者不像上面的示例中那樣添加類型註釋。
對於無狀態功能組件（SFC），請使用ES2015 SFC的默認初始化程序：

function Greet({ name = "world" }: Props) {
    return <div>Hello ${name.toUpperCase()}!</div>;
}

對@types/React的更改

仍然須要在@types/React中將LibraryManagedAttributes定義添加到JSX名稱空間的相應更改。
請記住，有一些限制。

/// <reference lib="..." />引用指令

TypeScript添加了一個新的三斜槓引用指令(/// <reference lib="..." />)，容許文件顯式包含現有的內置lib文件。
內置的lib文件以與tsconfig.json中的"lib"編譯器選項相同的方式引用（例如，使用lib ="es2015"而不是lib ="lib.es2015.d.ts"等）。
對於在內置類型上進行中繼的聲明文件做者，例如
建議使用DOM API或內置的JS運行時構造函數（如Symbol或Iterable，三斜槓引用lib指令）。
之前這些.d.ts文件必須添加此類型的前向/重複聲明。

將/// <reference lib="es2017.string" />用於編譯中的一個文件至關於使用--lib es2017.string進行編譯。

/// <reference lib="es2017.string" />

"foo".padStart(4);

介紹就這些，若是有不對或者想看具體詳情請到官網查看 http://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-0.html