Typescript

TypeScript学习笔记(三)- 类型检查、高级类型、命名空

2021-04-27  本文已影响0人  景阳冈大虫在此

类型检查

类型兼容性

x、y属性一样,多的那个类型可以被赋值给少的那个

interface x {
  a: number;
  b: number;
}
interface y {
  a: number;
  b: number;
  c: number;
}

let aobj: x = { a: 1, b: 2 };
let bobj: y = { a: 1, b: 2, c: 3 };

aobj = { a: 1, b: 2, c: 3 };// 不可以
aobj = bobj; // 可以
bobj = aobj;// 不可以

函数兼容性

type Handler = (a:number,b:number) => void;

function task(params: Handler) {
  return params;
}

入参为基础数据类型

  1. 入参多的可以兼容入参少的
  2. 返回值是对象,属性少的可以兼容属性多的
  3. 可选参数与剩余参数
type Handler1 = (a: number, b: number) => void;// 固定参数
type Handler2 = (a?: number, b?: number) => void;// 可选参数
type Handler3 = (...rest: number[]) => void;// 剩余参数
let h1: Handler1 = (a: number, b: number) => { };
let h2: Handler2 = (a?: number, b?: number) => { };
let h3: Handler3 = (...rest: number[]) => { };
h1 = h2 = h3;
"strictFunctionTypes": false, 

入参为对象

interface Point2D{
  x: number;
  y: number;
}

interface Point3D{
  x: number;
  y: number;
  z: number;
}

let p2d=(point: Point2D) => { };
let p3d = (point: Point3D) => { };

p2d = p3d;// 不可以  修改"strictFunctionTypes": false,  可以
p3d = p2d;// 可以

返回值类型

枚举兼容性

enum Fruit {
  Apple = 2,
  Banana = 3
}
let a: number = Fruit.Apple;// 可以
Fruit.Apple = Fruit.Banana;// 不可以

类兼容

class A {
  state: number;
  constructor(val: number) {
    this.state = val;
  }
  run(): number {
    return this.state;
  }
}

class B {
  state: number;
  static id: number;
  constructor(val: string) {
  }
  run(): number {
    return this.state;
  }
  walk(): number {
    return;
  }
}

let a = new A(1);
let b = new B('b');
a = b;// 可以
b = a;// 不可以

泛型兼容

interface A<T>{
  data: T;
}
let x: A<number>;
let y: A<string>;
x = y;  // T被使用时不可以,不被使用时可以

高级类型

交叉类型

interface A {
  run(): void;
}
interface B {
  walk(): void;
}
let c: A & B = {
  run() { },
  walk() { }
}

联合类型

let x: string | number;
let y: 'a' | 'b' | 'c';
let z = 1 | 2 | 3 | 4;

interface Square {
  kind: "square";
  size: number;
}

interface Rectangle {
  kind: 'rectangle';
  width: number;
  height: number;
}

type Shape = Square | Rectangle;
function area(s: Shape) {
  switch (s.kind) {
    case "square":
      return s.size * s.size;
    case "rectangle":
      return s.height * s.width;
    default:
      return ((e: never) => { throw new Error(e) })(s)  
        // 约束在type而不给case处理的情况,即强制要求每一个type都必须处理
  }
}

索引类型

// keyof T
interface Obj {
  a: number,
  b: string
}
let key: keyof Obj;

// T[K]
let value: Obj['a']

// T extends U
function getValue<T, K extends keyof T>(obj: T, keys: K[]): T[K][] {
  return keys.map(key => obj[key]);
}

映射类型

interface Obj {
  a: string;
  b: string;
  c: number;
}

// 同态
// 把所有类型变成只读的
type ReadonlyObj = Readonly<Obj>;
// 把所有类型变成可选的
type PartialObj = Partial<Obj>;
// 限定选取范围
type PickObj = Pick<Obj, 'a' | 'b'>;

// 非同态:会创建新的属性
// x,y属性都是Obj类型
type RecordObj = Record<'x' | 'y', Obj>;
let obj: RecordObj = {
  x: {
    a: 'a',
    b: 'b',
    c: 1
  },
  y: {
    a: 'a',
    b: 'b',
    c: 1
  }
}

namespace

namespace Square{
  let a = 1;
  let b = 2;
  export function task() {
    return a + b;
  }
}

Square.task();
编译

合并

function Lib() { }
namespace Lib {
  export let version = '1.0';
}
console.log(Lib.version);// 1.0
class C { }
namespace C {
  export let state = 1;
}
console.log(C.state);// 1

state为class C的静态成员

enum Color {
  Red,
  Yellow,
  Bule
}
namespace Color {
  export function mix() { }
}
console.log(Color);
上一篇 下一篇

猜你喜欢

热点阅读