개인공부/typescript

타입스크립트 : 클래스

minseokiim 2023. 9. 5. 17:23

* 클래스

class UserA{
 constructor(first:string, last:string, age:number) {
  this.first=first //에러
                            //타입스크립트에서 this로 접근할 수 있는 각각의 속성들은 constructor가 만들어지기 전에, 클래스 바디에서 타입 지정 되어 있어야 함
                   //* 클래스의 바디란 ? class키워드 사용하고 이름 지정된 다음에 중괄호 시작~끝 범위
   this.last=last //에러
  this.age=age //에러
 }
 getAge(){
  return `${this.first}${this.last} is ${this.age}`
 }
}

-> 에러 해결

class UserA{
 //this로 접근하는 속성의 타입 추가, 초기값을 줄 수도 있음 (ex. first:string=""), public은 접근제어자생략 가능
 first:string        
 last:string        
 age: number        
 constructor(first:string, last:string, age:number) {
  this.first=first 
   this.last=last 
  this.age=age 
 }
 getAge(){
  return `${this.first}${this.last} is ${this.age}`
 }
}

=> 간단히 만들기

class UserA{
 constructor(
  public first:string='',      //매개변수에서 public은 생략 불가능
  public last:string='',
  public age:number=0
  ) {
  }
  public getAge(){
   return `${this.first}${this.last} is ${this.age}`
  }
}


* 접근제어자
public - 어디서나 접근 가능, "클래스 바디"에서 생략 가능
protected - 나와 파생된 후손 클래스 내에서 접근 가능
private - 내 클래스에서만 접근 가능

ex 1. public

class UserA{
 first:string        
 last:string        
 age: number        
 constructor(first:string, last:string, age:number) {
  this.first=first 
   this.last=last 
  this.age=age 
 }
 getAge(){
  return `${this.first}${this.last} is ${this.age}`
 }
}

or

class UserA{
 public first:string =''       
 public last:string  =''      
 public age: number=0      
 constructor(first:string, last:string, age:number) {
  this.first=first 
   this.last=last 
  this.age=age 
 }
 public getAge(){
  return `${this.first}${this.last} is ${this.age}`
 }
}




class UserB extends UserA{
 getAge(){
  return `${this.first}${this.last} is ${this.age}`  //코드는 똑같지만, 새롭게 정의 => 덮어쓰기
                                                                                //public이라는 접근 제어자를 위에 추가했으므로 가능
 }


class UserC extends UserB{
 getAge(){
  return `${this.first}${this.last} is ${this.age}` 
 }
}

const min=new UserA("m","k",25)
console.log(min.age)



ex 2. protected

class UserA{
 protected first:string =''       
 protected last:string  =''      
 protected age: number=0      
 constructor(first:string, last:string, age:number) {
  this.first=first 
   this.last=last 
  this.age=age 
 }
 protected getAge(){
  return `${this.first}${this.last} is ${this.age}`
 }
}



class UserB extends UserA{
 getAge(){
  return `${this.first}${this.last} is ${this.age}` 
 }


class UserC extends UserB{
 getAge(){
  return `${this.first}${this.last} is ${this.age}` 
 }
}

const min=new UserA("m","k",25)
console.log(min.age)   //여기서는 에러 발생, UserA, UserB, UserC에서만 사용 가능(클래스 밖에서 허용 x)
 



ex 3. private

class UserA{
 private first:string =''       
 private last:string  =''      
 private age: number=0      
 constructor(first:string, last:string, age:number) {
  this.first=first 
   this.last=last 
  this.age=age 
 }
 private getAge(){
  return `${this.first}${this.last} is ${this.age}`
 }
}


class UserB extends UserA{
 getAge(){
  return `${this.first}${this.last} is ${this.age}` //에러, UserA 벗어난 하위클래스에서는 접근 불가
 }


class UserC extends UserB{
 getAge(){
  return `${this.first}${this.last} is ${this.age}` //에러, UserA 벗어난 하위클래스에서는 접근 불가
 }
}

const min=new UserA("m","k",25)
console.log(min.age) //에러, UserA 벗어난 하위클래스에서는 접근 불가