타입스크립트 기본 타입

Any

기존에 자바스크립트로 구현되어 있는 웹 서비스 코드에 타입스크립트를 점진적으로 적용할 때 활용하면 좋은 타입이다.

단어 의미 그대로 모든 타입에 대해서 허용한다는 의미를 갖고 있다.


let str: any = "hi";
let num: any = 10;
let arr: any = ["a", 2, true];


let myListOfThings: any[] = [1, 2, "Three", { four: 4 }];

myListOfThings.forEach((i) => console.log(i));
// 디노 출력 결과
// 1
// 2
// Three
// { four: 4}

any는 유용하지만 주의해서 사용해야 한다. any를 사용하면 "정적 형식 검사"라는 타입스크립트만의 장점이 사라진다.

type inference

타입스크립트에서 변수를 선언할때, 최초의 값을 문자나 숫자로 할당하면, 이후에 변수에 최초의 형태와 다른값을 할당하게되면 경고메시지같은게 뜬다.

타입스크립트는 항상 추적하여 유추한다.

explicit type assignment

흔히 아는 const 변수 :타입 = 할당값

Sep 17, 2021 업데이트

type과 interface 언제 쓰지?


export type TSomeMemberTier = "Basic" | "Premium" | "Admin";

export interface ISomeMember {
  name: string;
  age: number;
  address: string;
  tier: TSomeMemberTier;
}


// Use an interface instead of a type literal.tslint(interface-over-type-literal)
//타입은 리터럴 타입에서만 사용하고 Object 형태의 타입은 인터페이스를 쓰라는 소리다.

Type 은 리터럴 타입의 값에만 사용하고, Object 형태의 타입을 잡아줄 때는 Interface 를 사용하면 된다.

interface 예제 1


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

-------
const user: User = {
	name: "Hun",
	id: 0,
} // ok

--------
const user: User = {
  username: "Hun", // key가 다름
  id: 0,
}; // @error : 2322 !!

인터페이스는 클래스로도 선언할 수 있습니다.


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

class UserAccount {
  name: string;
  id: number;
  constructor(name: string, id: number) {
    this.name = name;
    this.id = id;
  }
}

const user: User = new UserAccount("Murphy", 1);

인터페이스는 함수에서 매개변수와 리턴 값을 명시하는데 사용되기도 합니다.


// @noErrors
interface User {
  name: string;
  id: number;
}
// ---cut---
function getAdminUser(): User {
  //... // 리턴값의 객체 값 형태 명시.
}
function deleteUser(user: User) {
  // ... // 매개변수의 객체 값 형태 명시.
}

타입을 구축하기 위한 두 가지 구문이 있다는 것을 꽤 빠르게 알 수 있을 것입니다.:

Interfaces and Types -

interface를 우선적으로 사용하고,

특정 기능이 필요할 때 type을 사용해야 합니다.