[TypeScript] Types (타입 선언)

 

type
number	1, 5.3, -10	모든 숫자, 소수
string	"hi", `hi`, 'hi'	모든 문자열
boolean	true, false	오직 두가지 참 or 거짓값
object	{age: 30}	JavaScript 객체, 더 구체적인 types이 가능하다.
Array	[1, 2, 3]	JavaScript 배열, 모든 type은 flexible하거나 strcit할 수 있습니다.
Tuple	[1, 2]	added by typescript : fixed-length array
Enum	enum{NEW, OLD}	Added by TypeScript: Automatically enumerated flobal constant identifiers
Any	*	Any kind of value, no specific type assignment
unknown
void
never
tuple

Any는 다양하게 쓰고 편하지만 기본적으로 TypeScript의 모든 장점을 없애기 때문에 가능한 쓰지 않는 것이 좋다.

 

any와 unknown 두 타입 모두 타입을 지정하기 애매한 경우에 사용하지만 unknown을 사용하는 경우 컴파일 에러가 발생하지만 any는 타입을 지정하지 않은 것과 마찬가지이기 때문에 컴파일 오류가 나지 않는다. 

 

그리하여 any보다는 unknown을 사용하는 것이 typeScript를 사용할 때 조금 더 안전하다. 

• Tuple Type

자바스크립트에는 없음.

고정길이배열 고정유형

const person: {
    name: string;
    age: number;
hobbies: string[];
role: [number, string];} = {
    name: 'hyemgu',
    age: 30,
    hobbies: ['Sports', 'Cooking'],
    role: [2, 'author']
};

 

• Union Type

유니온 타입은 | 연산자를 사용하여 아래와 같이 input1은 number or string이라는 의미다. 

function combine(input1: number|string , input2: number|string) {
    let result;
    if(typeof input1 ==='number' && typeof input2 ==='number'){
     result = input1 + input2;
    }else {
        result = input1.toString() + input2.toString();
    }
    return result;
}
const combinedAges = combine(30, 26);

const combinedNames = combine('Max', 'Anna');


console.log(combinedAges);
console.log(combinedNames);

리터럴타입

리터럴 타입은 집합 타입보다 구체적인 하위 타입이다. 

유니온타입과 결합하여서 사용 할 수 있으며 아래처럼 문자열 리터럴 타입(String Literal Types) 처럼 사용가능하다. 

  resultType: 'as-number' | 'as-text') //유니온타입과 리터럴타입의 결합

• AliasType

타입 별칭을 사용하여 타입을 직접 생성 할 수 있게 해준다.. 유니온 타입을 저장하는 것 뿐만 아니라 복잡할 수 있는 객체 타입에도 별칭을 붙일 수 있다.

 

type User = { name: string; age: number };
const u1: User = { name: 'Max', age: 30 };

타입 별칭을 사용하면 불필요한 반복을 피하고 타입을 중심에서 관리할 수 있습니다.

예를 들어, 다음 코드를 아래와 같이 단순화할 수 있습니다.

function greet(user: { name: string; age: number }) {
console.log('Hi, I am ' + user.name);
}
 
function isOlder(user: { name: string; age: number }, checkAge: number) {
return checkAge > user.age;
}

이것을 단순화 시키면 

type User = { name: string; age: number };
 
function greet(user: User) {
console.log('Hi, I am ' + user.name);
}
 
function isOlder(user: User, checkAge: number) {
return checkAge > user.age;
}