타입스크립트의 자료형은 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 캔버스 애니메이션 도 한번 살펴보세요~ :)
댓글