본문 바로가기
STUDY/TypeScript

[TS] 타입스크립트 입문

by ReCode.B 2023. 8. 30.
728x90

 

데이터 타입의 종류

타입스크립트에서는 다양한 데이터 타입을 지원합니다. 이러한 데이터 타입은 크게 기본 데이터 타입, 객체 타입, 특수 타입으로 나눌 수 있습니다.

 

기본 데이터 타입

  • number: 숫자 타입으로, 정수와 실수를 포함합니다.
  • string: 문자열 타입입니다.
  • boolean: 참(true)과 거짓(false)을 나타내는 불리언 타입입니다.
  • null: 값이 없음을 나타내는 타입입니다.
  • undefined: 값이 할당되지 않은 변수의 기본값인 타입입니다.

객체 타입

  • object: 객체를 나타내는 타입입니다.
  • array: 동일한 타입의 요소를 가진 배열을 나타내는 타입입니다.
  • tuple: 각 요소가 다른 타입을 가질 수 있는 배열을 나타내는 타입입니다. (TS 전용)

특수 타입

  • any: 어떠한 타입이든 할당될 수 있는 타입입니다. (TS 전용)
  • unknown: 타입을 미리 알 수 없는 경우에 사용되는 타입입니다. 이 타입은 안전한 타입 검사를 위해 사용됩니다. (TS 전용)
  • never: 절대 발생하지 않는 값의 타입을 나타냅니다. 예를 들어, 함수가 항상 예외를 발생시키거나 무한 루프를 실행할 때 이 타입을 사용할 수 있습니다. (TS 전용)

 

// *변수에 데이터타입 지정 방법 :
let myname: string = 'egoing';

//  *Array와 Tuple
let arr1: number[] = [1, 2, 3];

let arr2: Array<number> = [1, 2, 3];

let tuple: [string, number, boolean] = ["안녕", 1, true];

//  *객체
const user: {name:string, age:number} = {
    name : "nana",
    age : 25
}

//  *함수
function add(a:number , b:number ):number{
    return a + b
}

function greet(name: string, greeting?: string): string {
  if (greeting) {
    return `${greeting}, ${name}!`;
  } else {
    return `Hello, ${name}!`;
  }
}

console.log(greet("나나", "반가워"));
console.log(greet("나나"));

//  *Type Aliases
type Age = number;
const myAge: Age = 30;

//string Array
type Names = string[];
const myFriends: Names = ['Alice', 'Bob', 'Charlie'];

//tuple
type Coordinates = [number, number];
const myLocation: Coordinates = [37.7749, -122.4194];

type book_name_price = [string, number];
const book: book_name_price = ['타입스크립트생활코딩', 30000];

//객체
type User = {
    id: string;
    name: string;
    age: number;
}
const GameUser: User = { id: '1', name: 'nana', age: 28};

//함수
type GreetingFuntion = (name: string) => string;
const hello: GreetingFuntion = (name) => `hello ${name}!`;

//더 복잡한 형태
type UserId = string;
type UserName = string;
type UserAge = number;

type siteUser = {
    id: UserId;
    name: UserName;
    age : UserAge;
}

const WebsiteUser  = { id: '1', name: 'nana', age: 28};

 

출처 : https://opentutorials.org/course/5080/32303

728x90