TIL. typescript basic

Teasan·2021년 6월 19일
0

typescript

목록 보기
3/13
post-thumbnail

이 노트는 드림코딩의 [타입스크립트 + 객체지향 프로그래밍 마스터] 강의를 base로 작성되었습니다.

기본 타입 정리


변수를 선언하는 방법은 두가지이다.

let
한번 선언해도 수정할 수 있는 변수.
ES6 에서 처음 등장하였으며, 기존의 var 대신 쓰이는 변수이다.

  let name = "hello";
  재 선언 가능
  name = "hi";

const
한번 선언한 이후로는 바꿀 수 없는 변수.

  const age = 5;
  재 선언 불가능
  age = 5;

타입스크립트에서는 var를 사용하는 것을 지양한다. js로 프로젝트를 만들더라도, 바벨을 이용해서 js 최신 버전에서 낮은 버전으로 변환하여 배포를 하고 있기 때문에 버전 호환성을 이유로 굳이 var를 사용할 필요가 없기 때문이다.

JS의 타입


Primitive(원시타입)
한가지의 십플한 타입만 담을 수 있음

number
string
boolean
bigint
// (최신 버전-더 큰 숫자범외를 할당)
symbol
null
undefined

Object(오브젝트타입)
조금 더 복잡한 타입을 담을 수 있음.

function
array

Typescript의 타입


number
숫자 타입, 정수, 소수점, 마이너스 값 등.

const num: number = 0.1;

string
문자열만 할당 가능

const str: string = "hello";

boolean
true / false 할당 가능

const boal: boolean = true;

undefined
값이 있는지 없는지 조차 결정되지 않았을 때 사용한다.

let name: undefined; 
// **단독적으로 절대 쓰지 않는다.**

let age: number | undefined; 
// 보편적으로 null 보다 더 많이 쓰는 형태

age = undefined; 
// undefined로 할당해도 

age = 1; 
// '|'(또는) 을 사용했기 때문에 number로 할당 가능하다.

// undefined 예시
function find(): number | undefined {
	return undefined;
}

null
값이 없다는 걸(비워져있다는 걸) 명확하게 명시하고자 할때 사용한다.

let person: null; 
// **단독적으로 절대 쓰지 않는다.**

let person2: string | null; 
// undefined와 마찬가지로 '|'(또는)을 통해 사용한다.

point. undefined는 데이터 타입이 있거나, 아직 결정되지 않았거나 할 때 주로 사용하며, 보편적으로도 undefined를 더 많이 사용한다. 하지만 값이 있거나, 없거나를 나타날 때에는 null 을 사용하는 것이 문맥상 더 맞는 작성 방법이다.

example

// 무언가를 찾는 함수이며, 찾았다면 number를 리턴하고 | 아니면 undefined를 리턴하도록 정의했다.
 
function find(): number | undefined {
	return undefined;
}

이처럼, 무언가가 있다는게 명확하지 않을 때, (있거나, 있다는게 아직 결정되지 않았거나) undefined를 많이 사용한다.

unknown
알수 없는 이라는 뜻. 어떤 종류의 데이터든 담을 수 있는 형태. 그렇기에 무슨 타입인지 알 수가 없다. 가능하면 쓰지 않는게 좋음.

그럼에도 존재하는 이유? "타입스크립트는 타입이 없는 JS와 연동해서 쓸 수 있기 때문" 이다. 타입 스크립트에서 JS 라이브러리를 이용하는 경우에 JS에서 리턴하는 타입을 모를 수가 있다. 이럴 때에 사용하기 위해 존재하고 있으나, 가능하면 구체적으로 타입을 지정해서 쓰는 것이 좋으며 가급적 사용을 지양해야 한다.

let notSure: unknown = 0; // number
notSure = "he"; // string
notSure = true; // boolean

any
어떤 것이든 이라는 뜻. unknown과 마찬가지로 무엇이든 할당할 수 있다. 역시 쓰지 않는게 좋다.

let anthing: any = 0;
anthing = "hello";

void
함수에서 사용할 수 있는 타입 첫번째. 텅빈, 공허하다는 의미. 함수에서 아무런 것도 리턴하지 않으면 자동으로 붙는 타입. 생략도 가능하다. 보통은 함수에서 무언가를 리턴할 때 타입을 명시하는 것이 좋은 관례이다.

function print(): void {
    console.log("hello");
    return;
}

// volid는 변수에서 쓰이기도 하나, 사용이 극히 드물다.
let unusable: void = undefined;

never
함수에서 사용할 수 있는 타입 두번째. 주로 어플리케이션에서 에러를 던질 때 (핸들링이 어려운 에러일 때-) 처리하기 위해서 쓰는 타입. 즉, 나는 이 함수를 통해 리턴할 계획이 전혀 없으니까 이것을 감안하고 코딩하라는 말과 동일하다. naver 타입에는 절대 다른 것을 리턴할 수가 없으며, return을 기입하면 error가 발생하기 때문에 주의해야 한다. 변수에서는 사용하지 않는다.

function throwError(message: string): never {
// * message -> server (log) 메세지를 서버에 보내서 로그를 남기고
    throw new Error(message); 
	// 어플리케이션에서 에러를 던진다.

    /**
     * while (true) { }
     * while는 빙글빙글 돌기만 하고 리턴해주지 않는다. 
     */
  }

object
어떤 오브젝트의 타입도 데이터로 담을 수 있는 타입. 원시 타입을 제외한 모든 오브젝트 타입(배열도)을 할당할 수가 있다. 그러나, 되도록이면 쓰지 않는게 좋다. 타입은 좀 더 명확하게, 좀 더 자세하게, 가능하면 구체적으로 작성해야 하는 것을 절대 잊지 말아야 한다.

let obj: object;
function acceptSomeObject(obj: object) {}
// 어떠한 obj도 전달할 수 있다.
acceptSomeObject({ name: "elle" });
acceptSomeObject({ animal: "dog" });

출처 :
이 포스팅은 드림코딩의 [타입스크립트+객체지향 프로그래밍 마스터 과정] 강의를 기반으로 작성했습니다. https://academy.dream-coding.com/

profile
일단 공부가 '적성'에 맞는 개발자. 근성있습니다.

0개의 댓글