Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
Tags
- materialicons
- extends
- interface
- async
- 스크롤이벤트
- 슬라이딩윈도우
- javascript
- Filter
- app.post
- Spring
- supabase 페이지네이션
- generic
- mainapplication.kt
- TS
- meatadata
- 타입스크립트
- 배열중복요소제거
- 리액트네이티브아이콘
- 글또10기
- set
- reactnative
- 이진탐색
- 페이지네이션
- Next.js
- app:compiledebugkotlin
- react
- map
- array
- 안드로이드빌드에러
- 상속
Archives
- Today
- Total
rhanziy
TS - 추상클래스 및 인터페이스 본문
abstract class User {
constructor(
protected firstName: string,
protected lastName:string
){}
abstract sayHi(name:string):string
abstract fullName():string
}
class Player2 extends User {
sayHi(name:string){
return `Hello ${name}. My name is ${this.fullName()}`
}
fullName(){
return `#{this.firstName} ${this.lastName}`
}
}
타입스크립트에서 추상클래스를 구현하면 자바스크립트에서 컴파일했을 때 일반적인 클래스로 바뀌어버림.
class User {
constructor(firstName, lastName){
this.firstName = firstName;
this.lastName = lastName;
}
}
표준화된 프로퍼티와 메소드를 갖게하기 위해 추상클래스를 사용한 의미가 없어진다.
👉 인터페이스를 사용해야한다!
interface User {
firstName:string,
lastName:string,
sayHi(name:string):string
fullName():string
}
interface Human{
health:number
}
class Player2 implements User, Human{ //다중 인터페이스도 가능
constructor(
public firstName:string,
public lastName:string,
public health:number
){}
sayHi(name:string){
return `Hello ${name}. My name is ${this.fullName()}`
}
fullName(){
return `${this.firstName} ${this.lastName}`
}
}
인터페이스 특징
생성자가 없음.
오브젝트나 클래스의 모양을 특정지을 수 있다.
implements로 여러 인터페이스를 상속, 확장할 수 있다.
같은 이름을 사용해 다형성의 특징 구현 가능.
자바스크립트로 컴파일 됐을 때 보여지지 않음~
but 접근제한자 only public ㅠㅠ (private, protected ❌)
'Html_css_js' 카테고리의 다른 글
JS - id, pwd 유효성 검사 복습하다가 안됐던거. (0) | 2022.11.02 |
---|---|
TS - generic인자로 다형성 구현 (0) | 2022.11.01 |
css. flex? grid? flexbox의 마지막 행을 정렬하는 몇 가지 방법(펌) (0) | 2022.03.14 |
javascript. 게임 만들기 - double jump 구현😵 (0) | 2022.03.02 |
javascript. Arrow Function의 this 바인딩(펌) (0) | 2022.02.23 |
Comments