사진


타입 명시


변수를 선언할 때, 값의 타입을 명시함으로써 변수 값의 데이터 타입을 지정 하는것


Syntax


let x : string = "무조건 문자열이어야 한다. "
  : string

변수 이름 뒤에 : 콜론을 일력하고 콜론 뒤에 변수에 데이터 타입을 지정해 주면 된다.

let studentid : number = 12345;

변수 값이 숫자라서 아무런 에러도 발생 하지 않는다.

사진 사진

하지만 숫자를 문자열이나 다른 데이터 타입으로 바꾸고 컴파일러를 작동 시키면 터미널에서 볼 수 있듯이 컴파일 에러를 얻게 된다. 컴파일 에러는 코드를 작성 할 때 문법을 잘 못 작성해서 컴파일 시 생기는 오류를 나타내는 것이다.


예시


function getStudentDetails (studentId : number) {

}

함수의 파라미터 매개변수도 변수이기 때문에 타입을 지정 할 수 있다.

function getStudentDetails(studentId: number): void {

}

또한 함수의 결과 값 에도 타입을 명시할 수 있다.
파라미터가 들어가는 괄호 뒤에 : 콜론을 입력하고 함수의 값에 타입을 선언할 수 있다.
만약 함수가 아무런 값도 반환하지 않으면

:void 라는 타입을 명시 할 수 있다.
( void 란 이 함수는 아무것도 반환 하지 않는다 라는 의미를 부여 )

사진
만약 함수가 어떠한 특정 값을 반환하는 함수일 경우에는 void 대신 반환 되는 값에 타입을 명시해 주면 된다.
위 예시 getStudentDetails 함수는 학생의 정보를 불러오는 함수이기 때문에 아마도 반환되는 값의 타입이 객체 object 일 것이다.

사진

그러나 타입을 object로 지정하고 컴파일러를 실행시키면 터미널에 에러가 발생 한다.
이유는 void 나 any 타입이 아닌 타입이 명시된 경우에는 반드시 value 가 반환 되어야 하기 때문이다.
이러한 에러가 발생한 것은 타입스크립트 에서 이 함수는 object 객체를 반환하는 함수 라고만 명시했는데 함수는 아무런것도 반환 하고 있지 않아서 에러가 발생하는 것이다.
이럴땐 return 으로 null 을 입력해 주면 터미널에서 에러메시지를 보내지 않게 된다.

여기서 object 라고 명시 한것이 코드 자체로는 문제될 것은 없다 하지만, 타입스크립트에서의 일반적인 규칙은 타입스크립트로 코드를 짤때 타입에 관한 더 많은 정보를 타입스크립트 에게 전달 할수록 더 좋다. 이유는 더 많은 정보가 제공 될 수록 코드를 조금 더 깔끔하고 효과적이게 작성하고 유지보수 할 수 있도록 도와주기 때문이다.

단순히 함수의 반환값을 객체라고 지정하는것 보다 조금 더 세부적이고 자세하게 타입을 명시할 수 있으면 더욱 더 좋다.

function getStudentDetails (studentID : number): {
  studentID : number;
  studentName : string;
  age : number; 
  gender : string;
  subject : string;
  createDate : Date ;
}

실제로 반환하는 객체의 구조를 타입으로 명시할 수 있다.
반환되는 객체의 구조를 명시하기 위해서 객체 타입 대신 { } 중괄호 를 넣어주고 실제 객체와 유사한 property 속성과 타입을 지정해 준다.
반환되는 객체 구조를 타입으로 지정해줌으로써 함수의 반환값은 타입속에 명시된 property 가진 객체 여야 한다는 것을 보여준다.