Typescript 내용 정리

Basic Type(1)

강민승 2023. 4. 1. 00:35

Primitive Types

  • 오브젝트와 레퍼런스 형태가 아닌 실제 값을 저장하는 자료형이다.
  • 프리미티브 형의 내장 함수를 사용 가능한것은 자바스크립트 처리 방식 덕분
  • (ES2015 기준) 6가지
    • boolean
    • number
    • string
    • symbol (ES2015)
    • null
    • undefined
let name = "minseung";

name.toString();
  • 래퍼 겍체로 만들 수 있다.
new Boolean(false); // typeof new Boolean(false) : 'object'

new String('world'); // typeof new String('world') : 'object'

new Number(42); // typeof new Number(42) : 'object'

 

 

Boolean / boolean

  • 가장 기본적인 데이터 타입
  • 단순한 true 혹은 false 값이다.
  • JavaScript / TypeScript 에서 'boolean' 이라고 부른다. 
let isDone: boolean = false;

isDone = true;

console.log(typeof isDone); // boolean;

let isOk: Boolean = true;

// Type 'Boolean' is not assignable to type 'boolean'.
// 'boolean' is a primitive, but 'Boolean' is a wrapper object.
// Prefer using 'boolean' when possible.
let isNotOk: boolean = new Boolean(true);

 

 

Number / number

  • JavaScript 와 같이, TypeScript 의 모든 숫자는 부동 소수점 값이다.
  • TypeScript는 16진수 및 10진수 리터럴 외에도, ECMAScript 2015에 도입된 2진수 및 8진수를 지원한다.
  • NaN
  • 1_000_000 과 같은 표기 가능
let decimal: number = 6;

let hex: number = 0xf00d; //16진수

let octal: number = 0o744; //8진수

let binary: number = 0b1010; //2진수

let NotANumber: number = NaN;

let underscoreNum: number = 1_000_000;

 

 

template string

  • 행에 걸쳐 있거나, 표현식을 넣을 수 있는 문자열
  • 이 문자열은 backtick (= backquote) 기호에 둘러쌓여 있다.
  • 포함된 표현식은 `${ expr }` 와 같은 형태로 사용한다.
let fullName: string = "Minseung Gang";

let age: number = 32;

let sentence: string = `Hello, my name is ${fullName}.
I'll be ${age + 1} years old next month.`;

console.log(sentence); // I'll be 33 years old next month.

 

 

Symbol

  • ECMAScript 2015 의 Symbol
  • new Symbol 로 사용할 수 없다.
  • Symbol 을 함수로 사용해서 symbol 타입을 만들어낼 수 있다.
console.log(Symbol("foo") === Symbol("foo")); //false
  • 프리미티브 타입의 값을 담아서 사용한다.
  • 고유하고 수정불가능한 값으로 만들어준다.
  • 그래서 주로 접근을 막거나 접근을 필요한 경우에만 허락할 때 사용
const sym = Symbol();

const obj = {
  [sym]: "value",
};

obj["sym"]; //접근 불가능
obj[sym]; // 접근 가능

 

Undefined & Null

  • number 에 null 또는 undefined 를 할당할 수 있다는 의미.
  • 하지만, 컴파일 옵션에서 `--strictNullChecks`사용하면, null 과 undefined 는 void 나 자기 자신들에게만 할당할 수 있다.
    • 이 경우, null 과 undefined 를 할당할 수 있게 하려면, union type 을 이용해야 한다.
let name: string = null;
let age: number = undefined;

// strictNullChecks => true
// Type 'null' is not assignable to type 'string'.
let name: string = null; (X)

// null => null || void, undefined => undefined || void
// Type 'null' is not assignable to type 'undefined'.
let u: undefined = null; // (X)

let v: void = undefined; // (O)

let union: string | null | undefined = 'str';

 

 

Object

  • javascript의 객체와 조금 다르다.
  • "primitive type 이 아닌 것" 을 나타내고 싶을 때 사용하는 타입
// create by object literal
const person1 = { name: "Minseung", age: 32 };

// person1 is not "object" type.
// person1 is "{name: string, age: number}" type.

// create by Object.create
const person2 = Object.create({ name: "Minseung", age: 32 });

 

let obj: object = {};

obj = { name: "Mark" };

obj = [{ name: "Mark" }];

obj = 39; // Error

obj = "Mark"; // Error

obj = true; // Error

obj = 100n; // Error

obj = Symbol(); // Error

obj = null; // Error

obj = undefined; // Error


// 실제 사용의 예
declare function create(o: object | null): void;

create({ prop: 0 });

create(null);

create(42); // Error

create("string"); // Error

create(false); // Error

create(undefined); // Error


// Object.create
Object.create(0); // Error