interface 및 type

3308 단어
요약:https://stackoverflow.com/questions/37233735/typescript-interfaces-vs-types
 
1. 대상과 함수를 묘사할 수 있지만 쓰기가 다르다
// 
interface Point { x: number; y: number; } //
interface SetPoint { (x: number, y: number):
void; }
type Point = {
  x: number;
  y: number;
};

type SetPoint = (x: number, y: number) => void;

 
2. type은 원시 유형, 연합 유형과 원조를 설명할 수 있다
// primitive
type Name = string;// union
type PartialPoint = PartialPointX | PartialPointY;

// tuple
type Data = [number, string];

 
3. 상속을 실현할 수 있고 교차 상속(interface 상속 type, type 상속interface)
 
interface 계승interface(extends)
interface PartialPointX { x: number; }
interface Point extends PartialPointX { y: number; }

 
type 계승 type (&)
type PartialPointX = { x: number; };
type Point = PartialPointX & { y: number; };

 
interface 계승 type
type PartialPointX = { x: number; };
interface Point extends PartialPointX { y: number; }

 
type 상속interface (type 상속 type)
interface PartialPointX { x: number; }
type Point = PartialPointX & { y: number; };

 
4, 클래스는interface와 type을 실현할 수 있으며 방식은 같다(모두implements)
class와interface는 정적 상태이기 때문에 type이 결합 형식을 설명할 때 실현할 수 없습니다
interface Point {
  x: number;
  y: number;
}

class SomePoint implements Point {
  x: 1;
  y: 2;
}

type Point2 = {
  x: number;
  y: number;
};

class SomePoint2 implements Point2 {
  x: 1;
  y: 2;
}

type PartialPoint = { x: number; } | { y: number; };

// FIXME: can not implement a union type
class SomePartialPoint implements PartialPoint {
  x: 1;
  y: 2;
}

 
5.interface는 여러 번 정의될 수 있고 매번 정의된 속성은 마지막에 통합될 수 있다
// These two declarations become:
// interface Point { x: number; y: number; }
interface Point { x: number; }
interface Point { y: number; }

const point: Point = { x: 1, y: 2 };

좋은 웹페이지 즐겨찾기