TypeScript #1 interface, type
interface
interface Shape {
getArea(): number;
}
interface Shape {
getArea(): number;
}
getArea 함수가 정의될 것이고 그 함수는 number를 반환할 것이다.
class
간편하게 쓰는 방법
class Circle implements Shape {
constructor(private radius: number) {}
getArea() {
return this.radius * this.radius * Math.PI;
}
}
어렵게 쓰는 방법
class Circle implements Shape {
private radius: number;
constructor(radius: number) {
this.radius = radius;
}
getArea() {
return this.radius * this.radius * Math.PI;
}
}
두개 다 compile해서 파일을 비교해봤는데 차이가 없더라. 두개 다 아래처럼 나온다. 즉, 쉽게 쓰는 방법을 쓰자.
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
class Circle {
constructor(radius) {
this.radius = radius;
}
getArea() {
return this.radius * this.radius * Math.PI;
}
}
const circle = new Circle(5);
console.log(circle.getArea());
public과 private은 typescript 내부에서만 의미있다고 보면 된다. compile해서 만든거 보면 public으로 했을 때나 private으로 했을 때나 같은 코드가 나온다.
객체, extends
interface Person {
name: string;
age: number;
}
interface Developer extends Person {
skills: string[];
}
const taejoon: Person = {
name: 'taejoon',
age: 30,
};
const FEDeveloperTaejoon = {
name: 'taejoon',
age: 30,
skills: ['js', 'css', 'html'],
};
extends
를 이용해서 반복되는 type선언을 상속받았다. 그래서 중복코드를 줄일 수 있게 되었다.
type
부를 때는 type alias
라고 부른다.
type을 이용해서 interface와 동일하게 할 수 있다. 바로 위 예시를 토대로 type으로 바꿔보자.
type Person = {
...
}
type Developer = Person & {
...
}
...
type을 쓰면 typescript에서 못하는 것을 할 수 있다.
type People = Person[] // People이란 type에 뿌리인 Person type을 배열로 선언한다.
const people: Person = [taejoon, FEDeveloperTaejoon];
type Color = 'red' | 'orange' | 'yellow';
const color: Color = 'red';
interface와 type 무엇을 써야 할까?
- 라이브러리를 사용할 때는 interface 사용을 권장한다.
- 어떤 것을 사용하던 일관성있게 써라.
벨로퍼트님의 타입스크립트 강좌를 보고 정리한 내용입니다.
Author And Source
이 문제에 관하여(TypeScript #1 interface, type), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://velog.io/@joker77z/TypeScript-1
저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
벨로퍼트님의 타입스크립트 강좌를 보고 정리한 내용입니다.
Author And Source
이 문제에 관하여(TypeScript #1 interface, type), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@joker77z/TypeScript-1저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)