Typescript - 10

클래스 메서드

function 함수와 this 키워드

객체지향 언어에서 인스턴스는 this 키워드를 사용할 수 있는데 타입스크립트에서는 function 키워드로 만든 함수에 this 키워드를 사용할 수 있다.

메서드란?

타입스크립트에서 메서드는 function으로 만든 함수 표현식을 담고 있는 속성이다. 다음 클래스를 보자

class A{
// 클래스의 변수를 정의하고 number 타입의 기본값은 1이다.
  value : number = 1
// method를 함수 타입이고 void를 리턴한다.
  method : () => void = function() :void{
    console.log(`value : ${this.value}`)
  }
}
//클래스를 인스턴스화한다.
let a : A = new A();
//객체의 함수를 사용한다.
a.method();

클래스 메서드 구문

위의 코드는 가독성이 떨어진다. 타입스크립트는 클래스 속성 중 함수 표현식을 담는 속성은 function 키워드를 생략할 수 있게 하는 단축 구문을 제공한다.

class B {
  //기본 생성자로 public 접근제에자로 number타입의 value를 생성하고 초기값은 1이다
  constructor(public value : number = 1){}
  //메소드를 정의하고 void 타입이다
  anyMethod():void{
    console.log(`value: ${this.value}`)
  }
}

const b : B= new B(2)
b.anyMethod(); // value : 2

정적 메서드

클래스 속성은 static수정자를 속성 앞에 붙여서 정적으로 만들 수 있다.
메소드 또한 동일하다.
static을 사용하면 클래스를 인스턴스화 하지 않아도 사용이 가능하다.

class C{
  static anyWhere() : string{
    return 'anyWehre I can start'
  }
}
console.log(C.anyWhere()) //'anyWehre I can start'

메서드 체인

메서드를 이어서 계속 호출하는 방식 즉, .(dot)으로 계속 연결하는 것을 메서드 체인이라고 한다.

class Calc{
  constructor(public value : number = 0){}
  add(value : number){
  this.value += value
  return this
}
multiply(value : number){
    this.value *= value
    return this
  }
}

const calc = new Calc(2);
//this를 통해 클래스로 return 하기에 가능하다.
console.log(calc.add(2).multiply(4).value)