Typescript 사용법

김무연·2023년 12월 7일

TypeScript

목록 보기
3/4
  1. 변수에 직접 지정하는 방법
// 변수에 타입을 지정해주시면 됩니다.
let aaa : string = "안녕하세요"
let bbb : number = 123 
let ccc : boolean = true
let ddd : string | number = "안녕"
  1. 배열타입에 지정하는 방법
// 문자열만 있는 배열
let aaa:string[] = ["원두","은정","혜원"]

// 배열에 문자열과 숫자열을 같이 넣어두고 싶을 때
let fff:(string | number)[] = [1,2,3,"철수","영희"]

// 모두 숫자이거나 모두 문자인 배열
let hhh: string[] | number[] =[ "영희","철수" ]
hhh=[1,2,3]
  1. 객체타입에 지정하는 방법

객체는 Interface를 이용해서 직접 형식을 지정해주어야 합니다. 객체 타입을 만들어줄때 네이밍에는 관례가 있습니다.

interface의 I와 변수명을 합쳐주는 것 입니다. 예를 들어 객체를 담은 변수 이름이 Profile이라면 타입을 지정하는 객체는 IProfile로 네이밍해주는 것 이 관례입니다.

객체에서 해당 key에 value가 있으면 보내주고 싶다할 때!
→ ? 를 이용해주시면 됩니다.
? 는 ‘있으면’ 이라는 뜻 입니다.

name? : string
name인자가 존재하면 string 타입이다 라는 뜻입니다

props도 마찬가지로 객체이므로 props도 똑같이 타입지정을 해주어야 합니다

interface Ipropfile {
		name? : string // name이 있으면 string 타입이다 라는 뜻
		age : number 
		school : string
	}
const profile:Ipropfile = {
		name : "원두"
		age : 8
		school : "코캠 초등학교"
	} 

//age의 타입이 문자열이거나 숫자열일 때
interface Ipropfile{
		name : string
		age : string | number
		school : string
	}
const profile:Ipropfile = {
		name : "원두"
		age : 8 or "8살"
		school : "코캠 초등학교"
	} 
  1. 함수 타입

함수에 들어가는 매개변수에도 타입을 지정할 수 있으며, () 뒤에 : type 을 붙여 return값의 type도 지정해줄 수 있습니다

function add(price1: number, price2: number, unit: string): string { 
        return price1+price2+unit
    }
const result = add(1000,2000,"원")
  1. any 타입

JS처럼 모든 자료형이 다 들어갈 수 있습니다

let qqq: any = "철수"
qqq = true

❗️ 타입 스크립트에서의 또는, 그리고
→ 타입스크립트에서의 또는과 그리고는 자바스크립트와 비슷하지만 조금 다릅니다.

또는 : |
그리고 : &

profile
Notion에 정리된 공부한 글을 옮겨오는 중입니다... (진행중)

0개의 댓글