본문 바로가기
블로그 이미지

방문해 주셔서 감사합니다! 항상 행복하세요!

  
   - 문의사항은 메일 또는 댓글로 언제든 연락주세요.
   - "해줘","답 내놔" 같은 질문은 답변드리지 않습니다.
   - 메일주소 : lts06069@naver.com


TypeScript

Typescript 자료형

야근없는 행복한 삶을 위해 ~
by 마샤와 곰 2019. 4. 25.

 

 

타입스크립트의 자료형은 6가지로 크게 구분되어진다.

- number : 숫자

- string : 문자

- boolean : 논리

- void : 함수에서의 반환없음

- null : 값 없음

- undefined : 선언되지 않음

사용법은 "var 변수명 : 자료형 = 데이터" 로 표현한다. Swift랑 비슷한 느낌이다.

void, null, undefined는 자료형으로 선언은 할 수 없지만 값으로는 존재한다.

아래코드를 살펴보자.

var text : string = 'hello world';
console.log(text);

var num : number = 1234;
console.log(num);

var bool : boolean = false;
console.log(bool);

var method = (arg?) : void=>{ console.log(arg);}  //void로 선언
//파라미터의 arg뒤에있는 ?(물음표)는 옵셔널이다. 있어도 되고 없어도 되는 값이다.
// 당연히 var method : void는 안된다. 즉 함수에서 리턴값이 없을 때 붙인다.
method('print');

var data : any = null;  //객체값이 비어있음
console.log(data);

method();  //undefined 효과

void로 선언한 함수를 조금 더 쉽게 알아보면, 아래소스코드처럼 작업해도 무방하다.

function nums() : number{  //number를 리턴하는 함수
    return 10;
}
var num2 : number = 5;
var text : string = 'abcd';
console.log(num2 + nums());

function justPrint() : void{  //반환타입이 없는 함수
    console.log('Hello world');
}
text = 1;
justPrint();

만약 여기서 text에 1값을 넣으면 어떻게 될까? 컴파일시 오류가나며 js 파일로 만들어지지 않는다.

컴파일 오류

마찬가지로 일반 연산, 반복문도 사용 가능하다.

타입스크립트의 장점은 클래스와 인터페이스에서 잘 나타난다.

또한 자바처럼 제네릭을 제공하며, 위에서 보았듯이 람다식도 제공한다.


* ts파일은 자바스크립트 형태 파일이 아니며, 컴파일 되기 전 형태의 파일이다.
* ts파일은 java처럼 java 파일 형태이지 class 파일 형태가 아니다.
* ts파일은 반드시 tsc 명령어를 통해 js 파일로 컴파일 해야 된다 (예: tsc 대상파일.ts) -> js파일을 만들어줌
* 만들어진 js 파일은 html에 넣어서도 사용 가능하며, 일일이 하기 귀찮을 때는 node 대상.js를 입력하면 결과를 볼 수 있다.

반응형

'TypeScript' 카테고리의 다른 글

Typescript 인터페이스  (0) 2019.04.26
Typescript 유니언(Union)  (0) 2019.04.26
Typescript 배열  (0) 2019.04.26
Typescript 함수  (0) 2019.04.26
TypeScript 시작  (0) 2019.04.25
* 위 에니메이션은 Html의 캔버스(canvas)기반으로 동작하는 기능 입니다. Html 캔버스 튜토리얼 도 한번 살펴보세요~ :)
* 직접 만든 Html 캔버스 애니메이션 도 한번 살펴보세요~ :)

댓글