조아마시

쓸모 있는 상세페이지 만들기

웹개발/typescript

[타입스크립트] 숫자 타입

joamashi 2024. 8. 30. 22:00

타입스크립트에서 숫자 타입은 숫자 값을 나타내는 기본적인 데이터 타입입니다. 자바스크립트와 마찬가지로 모든 숫자는 부동 소수점 숫자로 취급됩니다.

숫자 타입 선언하기

let num: number = 10; // 10진수
let hex: number = 0xf00d; // 16진수
let binary: number = 0b1010; // 2진수
let octal: number = 0o744; // 8진수
  • 10진수: 우리가 일반적으로 사용하는 숫자입니다.
  • 16진수: 0x로 시작하며, 주로 색상 코드나 비트 연산에서 사용됩니다.
  • 2진수: 0b로 시작하며, 컴퓨터 내부에서 숫자를 표현하는 방식입니다.
  • 8진수: 0o로 시작하며, 과거 유닉스 시스템에서 자주 사용되었습니다.

숫자 연산

let x: number = 10;
let y: number = 5;

// 기본적인 사칙연산
let sum: number = x + y;
let difference: number = x - y;
let product: number = x * y;
let quotient: number = x / y;

// 나머지 연산
let remainder: number = x % y;

// 증가, 감소 연산
x++; // x = x + 1
y--; // y = y - 1

숫자 타입의 특징

  • 정수와 실수 구분 없음: 모든 숫자는 부동 소수점 숫자로 처리됩니다.
  • 큰 숫자 표현: JavaScript의 Number 타입과 동일하게 매우 큰 숫자를 표현할 수 있습니다.
  • NaN (Not a Number): 잘못된 연산 결과를 나타냅니다. 예를 들어, 숫자가 아닌 값과의 연산이나 0으로 나누기 등에서 발생합니다.
  • Infinity: 무한대를 나타냅니다. 매우 큰 숫자를 매우 작은 숫자로 나눌 때 발생할 수 있습니다.

숫자 타입의 활용

  • 수량 표현: 상품 가격, 재고 수량 등을 나타냅니다.
  • 계산: 다양한 수학적 계산에 사용됩니다.
  • 비교: 숫자 값을 비교하여 조건문이나 반복문을 구성합니다.
  • 인덱싱: 배열의 요소에 접근할 때 인덱스로 사용됩니다.

추가적으로 알아두면 좋은 점

  • BigInt 타입: 매우 큰 정수를 표현하기 위한 타입입니다. 일반적인 숫자 타입으로는 표현할 수 없는 큰 숫자를 다룰 때 사용합니다.
  • Number 타입의 메서드: 숫자 객체에는 다양한 메서드가 제공됩니다. 예를 들어, toFixed()는 소수점 자릿수를 지정하여 문자열로 변환하는 메서드입니다.

예시: 간단한 계산기

function calculator(num1: number, num2: number, operator: string): number {
  switch (operator) {
    case '+':
      return num1 + num2;
    case '-':
      return num1 - num2;
    case '*':
      return num1 * num2;
    case '/':
      if (num2 === 0) {
        throw new Error('0으로 나눌 수 없습니다.');
      }
      return num1 / num2;
    default:
      throw new Error('지원되지 않는 연산자입니다.');
  }
}

let result = calculator(10, 5, '*');
console.log(result); // 50

 

다양한 방식으로 숫자 값 표현하기

지금까지 기본적인 숫자 타입 선언 방법에 대해 알아보았습니다. 하지만 타입스크립트는 숫자 타입을 선언하는 데 있어 더욱 유연하고 다양한 방법을 제공합니다. 이번에는 숫자 타입을 선언하는 좀 더 세련되고 효율적인 방법들을 살펴보겠습니다.

1. 리터럴 타입을 이용한 숫자 범위 제한

특정 범위의 숫자만 허용하고 싶을 때 리터럴 타입을 사용하여 숫자의 값을 제한할 수 있습니다.

type PositiveNumber = 1 | 2 | 3 | 4 | 5;
let myNumber: PositiveNumber = 3; // 1, 2, 3, 4, 5 중 하나만 할당 가능

위 예시에서는 PositiveNumber 타입이 1부터 5까지의 숫자 중 하나만 가질 수 있도록 제한되어 있습니다.

2. 유니온 타입을 이용한 복합적인 숫자 타입

여러 개의 숫자 타입을 하나의 타입으로 묶고 싶을 때 유니온 타입을 사용합니다.

type StatusCode = 200 | 404 | 500;
let statusCode: StatusCode = 404; // 200, 404, 500 중 하나만 할당 가능

위 예시에서는 StatusCode 타입이 HTTP 상태 코드 중 200, 404, 500만 가질 수 있도록 제한되어 있습니다.

3. 인터섹션 타입을 이용한 복합적인 제약 조건

유니온 타입과 달리, 인터섹션 타입은 여러 타입의 모든 조건을 만족해야 합니다.

type PositiveEvenNumber = number & {
  readonly brand: unique symbol;
  readonly __isPositiveEven: true;
};

function isPositiveEven(n: number): n is PositiveEvenNumber {
  return n > 0 && n % 2 === 0;
}

let myNumber: PositiveEvenNumber = 4; // 양의 짝수만 할당 가능

위 예시에서는 PositiveEvenNumber 타입이 숫자이면서 양수이고 짝수여야 합니다. brand와 __isPositiveEven 프로퍼티는 타입 가드를 위한 추가적인 정보를 제공합니다.

4. enum을 이용한 열거형 숫자

관련된 숫자 값들을 이름과 함께 관리하고 싶을 때 enum을 사용합니다.

enum Direction {
  Up = 1,
  Down,
  Left,
  Right
}

let direction: Direction = Direction.Up;

위 예시에서는 Direction enum을 통해 방향을 나타내는 숫자 값들을 관리합니다.

5. TypeScript의 숫자 메서드 활용

TypeScript는 숫자 객체에 다양한 메서드를 제공하여 숫자 값을 조작하고 변환할 수 있습니다.

let num: number = 3.14159;
let roundedNum: number = Math.round(num); // 반올림
let ceilNum: number = Math.ceil(num); // 올림
let floorNum: number = Math.floor(num); // 내림

6. BigInt 타입을 이용한 큰 정수 표현

JavaScript의 Number 타입으로 표현할 수 없는 매우 큰 정수를 다룰 때 BigInt 타입을 사용합니다.

let bigIntNum: bigint = 12345678901234567890n;

7. 템플릿 문자열을 이용한 숫자 포맷팅

숫자를 특정 형식으로 출력하고 싶을 때 템플릿 문자열을 사용합니다.

let price: number = 12345.67;
let formattedPrice: string = `$${price.toFixed(2)}`; // $12,345.67

이미 다양한 예시를 통해 숫자 타입을 선언하는 방법을 살펴보았지만, 타입스크립트는 끊임없이 발전하고 있으며 더욱 정교하고 유연한 타입 선언 방식을 제공합니다. 이번에는 좀 더 심층적으로 숫자 타입을 다루는 방법에 대해 알아보겠습니다.

1. 인덱스 시그니처를 이용한 동적 프로퍼티

인덱스 시그니처를 사용하면 객체의 프로퍼티 이름이 숫자일 때 해당 프로퍼티의 타입을 지정할 수 있습니다.

interface NumberDictionary {
  [index: number]: string;
}

let myDict: NumberDictionary = {
  1: 'one',
  2: 'two'
};

위 예시에서는 NumberDictionary 인터페이스를 통해 숫자를 키로 가지는 문자열 값을 가진 객체를 정의합니다.

2. 매핑 타입을 이용한 타입 변환

매핑 타입을 사용하여 기존 타입의 프로퍼티를 변환하거나 새로운 프로퍼티를 추가할 수 있습니다.

interface User {
  name: string;
  age: number;
}

type ReadonlyUser = Readonly<User>; // 모든 프로퍼티를 읽기 전용으로 만듦
type PartialUser = Partial<User>; // 모든 프로퍼티를 선택적으로 지정 가능

3. 조건부 타입을 이용한 복잡한 타입 계산

조건부 타입을 사용하여 특정 조건에 따라 다른 타입을 반환할 수 있습니다.

type IsNumber<T> = T extends number ? true : false;

4. infer 키워드를 이용한 제네릭 타입 추론

infer 키워드를 사용하여 제네릭 타입의 특정 부분을 추론할 수 있습니다.

type ReturnType<T> = T extends (...args: any[]) => infer U ? U : never;

5. Mapped Type 키워드

  • keyof: 객체의 모든 키를 유니온 타입으로 반환합니다.
  • in: 매핑 타입에서 각 프로퍼티를 순회하며 새로운 타입을 생성합니다.
  • typeof: 타입의 문자열 표현을 얻습니다.
interface Person {
  name: string;
  age: number;
}

type ReadonlyKeys<T> = {
  [P in keyof T as T[P] extends Readonly<any> ? P : never]: P;
};

6. TypeScript 4.1 이후의 기능

  • Template Literal Types: 템플릿 리터럴을 사용하여 문자열 유니온 타입을 생성합니다.
  • Recursive Conditional Types: 조건부 타입에서 재귀적인 타입 정의를 허용합니다.

7. TypeScript의 타입 시스템과의 연동

  • Generics: 다양한 타입에 대해 재사용 가능한 함수와 클래스를 정의합니다.
  • Interfaces: 객체의 구조를 정의합니다.
  • Type Aliases: 복잡한 타입에 간단한 이름을 부여합니다.
728x90