본문 바로가기
IT/TypeScript

[TypeScript] - 타입스크립트 자료형 타입 선언하는 방법

by 차이나는 개발자 2024. 3. 14.
728x90
반응형

타입스크립트(TypeScript)란?

타입스크립트(TypeScript)는 Microsoft에서 개발한 프로그래밍 언어입니다. 타입스크립트는 자바스크립트(JavaScript)의 상위 집합으로, 자바스크립트의 모든 기능을 포함하면서 정적 타입 체크와 클래스 기반 객체 지향 프로그래밍 등의 추가 기능을 제공합니다.

타입스크립트는 개발자가 코드를 작성할 때 타입을 명시적으로 지정할 수 있는 정적 타입 체크를 제공합니다. 이를 통해 컴파일 시간에 타입 오류를 찾아내고 예방할 수 있으며, 코드의 안정성과 가독성을 높일 수 있습니다. 타입스크립트는 개발 과정에서 발생할 수 있는 오류를 줄이고 디버깅을 용이하게 만들어 줍니다.

또한, 타입스크립트는 최신 ECMAScript 표준을 지원하며, 클래스, 모듈, 인터페이스, 제네릭 등의 고급 개념을 사용하여 구조화된 코드를 작성할 수 있습니다. 이를 통해 대규모 애플리케이션의 개발과 유지보수를 더욱 효율적으로 할 수 있습니다.

타입스크립트는 자바스크립트로 컴파일되어 모든 브라우저와 플랫폼에서 실행될 수 있습니다. 따라서 기존의 자바스크립트 코드와의 호환성이 뛰어나며, 기존 자바스크립트 프로젝트에도 점진적으로 도입할 수 있습니다.

 

 

타입스크립트(TypeScript)에서 사용할 수 있는 다양한 자료형(Data Types) 종류

1. 숫자(Number): 정수 및 부동소수점 숫자를 표현합니다. 예: `let a: number = 25;`

let a: number = 25;
console.log(a);

 


2. 문자열(String): 텍스트 데이터를 표현합니다. 예: `let b: string = "kim";`

let b: string = "kim";
console.log(b);

 


3. 불리언(Boolean): `true` 또는 `false` 값을 가지는 논리적인 데이터를 표현합니다. 예: `let isActive: boolean = true;`

let isActive: boolean = true;
console.log(isActive);

 


4. 배열(Array): 여러 개의 값을 순차적으로 저장하는 데이터 구조를 표현합니다. 예: `let arr: number[] = [1, 2, 3];`

let arr: number[] = [1,2,3];
console.log(arr);

 


5. 튜플(Tuple): 고정된 요소 수와 각 요소의 자료형이 정의된 배열을 표현합니다. 예: `let person: [string, number] = ["John Doe", 25];`

let person: [string, number] = ["John Doe", 25];
console.log(person);

 


6. 객체(Object): 속성과 해당 속성의 자료형을 포함하는 복합 데이터 구조를 표현합니다. (name? 물음표를 사용해서 값이 없을 경우에도 에러가 발생하지 않습니다.)

예: `let obj: { name?: string, age?: number } = { name: "kim", age: 23 };`

let obj: {name? :string, age? :number} = {name:"kim", age:23}
console.log(obj)

 


7. 열거형(Enum): 이름에 대한 상수 값을 가지는 데이터 타입을 정의합니다. 예: `enum Color { Red, Green, Blue };`

enum Color { Red, Green, Blue };
let choiceColor: Color = Color.Blue;
if(choiceColor === Color.Blue){
    console.log('Yes');
}

 


8. 유니언(Union): 두 개 이상의 자료형 중 하나를 표현합니다.

let c:number | string = "3";
c = 33;
console.log(c);

 


9. any: 모든 자료형을 허용하는 동적 타입을 표현합니다.

let f: any = "3"
f = 5
f = true
console.log(f);

 

 

10. 함수(Function): 함수의 파라미터 자료형을 표현합니다. (return 타입의 경우 파라미터와 타입이 같아야 합니다.)

function add(x: number) {
    return x * 2;
}

 

 

11. 클래스(Class): 클래스 생성자에 들어가는 필드의 자료형을 표현합니다.

class User {
    name: string;
    constructor(name: string){
        this.name = name;
    }
}

 

 

12. 자료형들을 그룹화하여 자료형을 제한하여 표현할 수 있습니다.

type TypeGroup = string | number;
let e: TypeGroup = 123;
console.log(e);

 

 

이 외에도 인터페이스(Interface) 등을 사용하여 더 복잡한 자료형을 정의할 수 있습니다. 타입스크립트는 정적 타입 체크를 제공하기 때문에 코드의 안정성과 가독성을 높일 수 있습니다.

 

 

 

728x90
반응형

댓글