TypeScript 기본 타입: string, number, boolean

TypeScript 타입은 변수가 어떤 종류의 값을 담을 수 있는지를 나타냅니다. 콜론 뒤에 타입을 쓰면(let name: string) 컴파일러가 잘못된 종류의 값을 넣는 코드를 거부합니다. 기본 타입은 JavaScript의 일곱 가지 원시 타입과, 배열과 객체를 위한 객체 타입입니다.

let title: string = "TypeScript";
let version: number = 7;
let isStrict: boolean = true;
let big: bigint = 9007199254740993n;
let id: symbol = Symbol("id");
let nothing: null = null;
let notSet: undefined = undefined;

let scores: number[] = [90, 72, 85];
let user: { name: string; age: number } = { name: "Ada", age: 36 };

console.log(title, version, isStrict, big, id);
console.log(nothing, notSet);
console.log(scores, user);

타입 표기는 컴파일할 때 검사된 뒤 제거됩니다. 실제로 실행되는 프로그램은 평범한 JavaScript입니다.

원시 타입

타입 이름은 소문자입니다. 런타임의 typeof도 대부분 같은 단어를 돌려주므로, 프로그램 실행 중에 값의 원시 타입을 확인할 때는 typeof x === "number"처럼 씁니다.

타입 표기(Type Annotation)

타입 표기는 변수, 매개변수, 함수의 매개변수 목록 뒤에 붙이는 : Type입니다. 가장 중요한 곳은 매개변수입니다. 호출하는 쪽이 무엇을 넘길지 TypeScript가 추측할 수 없기 때문입니다.

function describe(name: string, age: number, admin: boolean): string {
    return `${name} (${age})${admin ? " [admin]" : ""}`;
}

let label: string = describe("Ada", 36, true);
console.log(label); // Ada (36) [admin]

// Without an annotation, TypeScript infers the type from the value:
let count = 10; // count: number
count = count + 1;
console.log(count); // 11

같은 줄에서 변수를 초기화한다면 타입 표기는 대개 필요 없습니다. let count = 10은 이미 number 타입입니다. 타입을 생략하는 규칙은 타입 추론 페이지에서 다룹니다.

잘못된 타입은 컴파일 오류

잘못된 타입의 값을 대입하면 아무것도 실행되기 전에 컴파일러가 멈춥니다.

// This does not compile: a string is not a number.
let port: number = 8080;
port = "3000";
console.log(port);

컴파일러는 다음과 같이 출력합니다.

index.ts(3,1): error TS2322: Type 'string' is not assignable to type 'number'.

값을 변환하거나(port = Number("3000")), 변수가 정말 텍스트를 담아야 한다면 타입 표기를 바꾸면 됩니다.

number: 정수 타입은 없다

JavaScript는 모든 숫자를 64비트 부동소수점 값으로 저장하므로 TypeScript에도 number 타입 하나만 있습니다. 정수는 Number.MAX_SAFE_INTEGER(2 ** 53 - 1)까지 정확하게 표현됩니다. 그보다 크면 bigint를 쓰세요.

let price: number = 19.99;
let quantity: number = 3; // also number: no int type

console.log(Number.isInteger(quantity)); // true
console.log(Number.isInteger(price));    // false
console.log(Math.trunc(7 / 2));          // 3 (integer division)
console.log(0.1 + 0.2);                  // 0.30000000000000004

console.log(Number.MAX_SAFE_INTEGER);     // 9007199254740991
console.log(Number.MAX_SAFE_INTEGER + 2); // 9007199254740992 (wrong)

let exact: bigint = 9007199254740991n + 2n;
console.log(exact); // 9007199254740993n

// @ts-expect-error: bigint and number cannot be mixed
const mixed = () => exact + 1;
console.log(exact + BigInt(1), Number(exact)); // 9007199254740994n 9007199254740992

bigint와 number는 섞을 수 없습니다. exact + 1은 컴파일 오류(TS2365: Operator '+' cannot be applied to types 'bigint' and '1'., 여기서 '1'은 1의 리터럴 타입)이며, 만약 실행된다 해도 런타임에 TypeError가 납니다. BigInt(1)이나 Number(exact)로 한쪽을 명시적으로 변환하세요. 단, Number는 안전 범위를 넘는 값을 반올림한다는 점을 기억하세요.

정수만 받는 타입을 원해도, 임의의 값에 대해서는 TypeScript로 표현할 수 없습니다. 값이 프로그램에 들어오는 지점에서 Number.isInteger로 검증하세요.

boolean

boolean의 값은 true와 false 두 개뿐입니다. 단지 truthy인 값(1, "yes")은 boolean이 아니므로 Boolean(x)나 x !== 0으로 변환합니다.

let loggedIn: boolean = false;
const items: string[] = ["a", "b"];

const hasItems: boolean = items.length > 0;
const hasName: boolean = Boolean("Ada");

console.log(loggedIn, hasItems, hasName); // false true true

null과 undefined

strict가 켜져 있으면(TypeScript 6.0부터 기본값) null과 undefined는 별도의 타입이며 string, number 등 다른 타입에 포함되지 않습니다. 비어 있을 수 있는 변수는 유니언으로 그 사실을 드러냅니다.

let nickname: string | undefined;
console.log(nickname); // undefined

nickname = "Ace";
console.log(nickname.toUpperCase()); // ACE

let middleName: string | null = null;
console.log(middleName ?? "(none)"); // (none)

undefined일 수 있는 값의 프로퍼티를 읽으면 확인하기 전까지 컴파일 오류가 납니다. 확인 방법과 ?., ??는 null과 undefined 페이지에서 다룹니다.

배열과 객체 한눈에 보기

원시 타입이 아닌 것은 모두 객체 타입입니다. 처음 만나게 되는 세 가지 형태는 다음과 같습니다.

let tags: string[] = ["ts", "js"];               // array of strings
let point: { x: number; y: number } = { x: 1, y: 2 }; // object with two number properties
let greet: (name: string) => string = (n) => `hi ${n}`; // function type

각각 별도의 페이지가 있습니다: 배열, 튜플(길이가 고정된 배열), 객체 타입, 함수 타입.

string, number, boolean과 String, Number, Boolean

대문자로 시작하는 이름은 일반 값이 아니라 JavaScript 래퍼 객체(new String("x"))의 타입입니다. 타입 표기에는 소문자 이름을 쓰세요.

// This does not compile: String (the wrapper) is not string (the primitive).
const wrapped: String = "text";
const plain: string = wrapped;
console.log(plain);

index.ts(3,7): error TS2322: Type 'String' is not assignable to type 'string'.
  'string' is a primitive, but 'String' is a wrapper object. Prefer using 'string' when possible.

첫 줄의 String을 string으로 바꾸면 코드가 실행됩니다. Number, Boolean, Symbol, BigInt도 마찬가지입니다. (Object는 다른 경우입니다. 원시 값을 포함해 거의 모든 값을 받아들입니다. 객체 타입 페이지를 참고하세요.)

그 밖의 내장 타입

일찍 마주치는 타입이 몇 가지 더 있습니다. 각각 별도의 페이지가 있습니다.