TypeScript 타입스크립트 정리2

강다현·2022년 1월 24일
1

3주차

목록 보기
1/6

String (문자타입)

let bbb: string;
bbb = "반갑습니다"

let bbb: string;
bbb = 123 // error

string으로 선언하였기 때문에 문자 외엔 에러가 발생한다.

Number (숫자타입)

let ccc: number = 5

ccc = "asdf" // error

number으로 선언하였기 때문에 숫자 외엔 에러가 발생한다.

Boolean (불린타입)

let ddd: boolean
ddd = true

ddd = 123 // error
ddd = "asdf" // error

불린타입은 true 또는 false 로 선언하여야 한다.

Object (객체타입)

타입을 지정해주는 곳에 객체 타입을 뜻하는 {}를 써주고, 그 안에 각각의 Property 타입을 지정

interface IProfile {
  name: string
  age: number | string
  school: string
}
// interface로 타입을 지정하고 분리하여 선언할 수 있다

const profile: IProfile = {
  name: "철수",
  age: 8,
  school: "다람쥐초등학교"
}

profile.school = 123
profile.age = "8살"
const puppy: {
  name: string;
  age: number;
} = {
  name: "kong",
  age: 6
}

Array

배열 안의 요소들의 타입과 배열 타입을 합쳐 string[] 의 식으로 지정한다. string 외 여러 종류의 타입을 필요로 하는 배열의 경우엔 any타입을 사용하면 된다.

let eee: number[] = [1, 2, 3, 4, 5, "안녕하세요"] (error)
**변수에 숫자타입으로 선언 후 배열안에 숫자외 문자가 들어가면 에러가 발생한다.

let fff: string[] = ["철수", "영희", "훈이", 13] (error)
**변수에 문자타입으로 선언 후 배열안에 문자외 숫자가 들어가면 에러가 발생한다.

let ggg: (string | number)[] = [1, 2, 3, 4, "철수", "영희"]
let hhh: string[] | number[] = ["철수", "영희", "훈이"]
hhh = [1, 2, 3]
**변수에 문자 또는 숫자 타입으로 선언 후 배열안에 문자와 숫자가 혼합으로 입력할 수 있다.

Tuple

배열 안의 각 요소들의 타입을 따로따로 지정해줄 때 사용한다. 배열의 길이가 다를 경우에 오류가 발생하기 때문에 배열의 길이가 변하지 않고 고정되어 있을 때 사용해야한다.

const person: {
  name: string;
  age: number;
  hobbies: string[];
  snack: [string, number];
} = {
  name: "kong",
  age: 6,
  hobbies: ["eating", "running"];
  snack: ["cookies", 10];
}

위의 표현식 외 role: ["cookies", 10, true] 요소가 추가되면 에러가 발행한다.
** 확실한 때에 사용


Any

기존에 자바스크립트로 구현되어 있는 코드에 타입스크립트를 활용하면 좋은 타입이다.
모든 타입에 대해 허용한다는 의미를 가지고 있지만 any를 사용하게 되면 타입이 다르다고 오류를 나타날때 문자는 없지만 코드에 오류가 있을 경우 실수를 발견 하기 어렵다. **주의


Void

리턴타입이 없다는 것. 함수의 반환타입으로 사용된다. 어떠한 타입도 가지지 않는 빈 상태를 의미하며 값을 재할당 할 수 없다.(undefined와 의미는 같지만 쓰임은 다름) undefined 값을 얻기 위해 void(0)과 같은 형태로 종종 사용한다.

undefined : 설정 불가, 쓰기 불가한 속성

**void 참고**
- void의 경우, 타입으로만 존재를 하기 때문에 void를 넣을 수 없고 값만 넣을 수 있다.
따라서 null을 넣을 수 없으며, 타입이긴 하지만 값이기도 한 undefined는 넣을 수 있다.
- 변수에는 undefined와 null만 할당하고, 함수에는 반환 값을 설정할 수 없는 타입이다.

** 타입을 입력할 경우 AutoCompletion 해주어 해당 변수에서 사용가능한 메서드를 보여줄 수 있다. 타입이 없거나 any를 사용할 경우 AutoCompletion이 되지 않는다.

profile
Hello🖐

0개의 댓글