본문 바로가기
Programming/typescript 공부

[TypeScript] 기본 타입 #1

by Kyoung2 2023. 1. 9.
반응형

타입스크립트에서 변수를 선언할 때 해당 변수의 타입을 지정할 수 있다.

타입을 지정할 때는 변수 이름뒤에 " variable : type" 형태로 지정합니다.

 

ex)

export default function() {}
let message : string = 'Hello world';

 

기본적으로 타입스크립트가 적용된 프로젝트에서는 선언된 변수를 사용하지 않으면 에러 발생!

 

숫자  : number 

공백 : null OR undefined 

boolean : true/false

 "|" : 유니온 타입 "OR"을 의미함

Any : 모든 타입의 값을 대입 

 

C#을 하는 나로써는 조금 어색하긴하다.  타입을 지정하는 타입스크립트 마저도... 왜 이렇게 자유로워 보일까..

 

함수타입

function sum(a: number, b:number){
	return a + b;
}

파라미터에 숫자가 아닌 다른 타입의 값을 넣으면 오류가 발생...은 당연한거 아닌가????????????????????

아무튼 그렇다구 한다..

 

function sum(a : number, b: number): number {
	return a + b;
}

반환값을 미리 지정할 수 도 있다. 

 

옵셔널 파라미터

  - 옵셔널 파라미터는 생략해도 되는 파라미터를 의미한다.

function process(a: number, b: number, isDouble?: boolean){
const sum = a+b;
return isDouble ? sum * 2 : sum;
}

const total = process (1 ,2);
const doubledTotal = process (1,2,true);

isDouble의 타입은 boolean | undefined 로 설정된다....

활용은 잘 할 수 있을꺼같긴한대,  주석을 엄청 많이 써놓거나 책갈피를 해놔야할거 같은 느낌이든다.

 

인터페이스 interface

  - 타입스크립트에서 객체나 크래스를 위한 타입을 정할 때 사용.

  - 아 아무튼 인터페이스

interface Profile {
	id: number;
    username : string;
    displayName : string;
}

function print(profile : Profile){
	console.log(profile.username);
}

const profile: Profile = {
	id : 1,
    username:'taekyoung',
    displayName: 'kyoungs',
};

print(profile);

 

 인터페이스에서 인터페이스를 참조하는 것도 가능하단다.

 

728x90
반응형

# 로딩 화면 동작 코드(Code) 설정하기
loading