TypeScript 공부(2)

김희목·2024년 8월 23일
0

패스트캠퍼스

목록 보기
45/54
post-custom-banner

타입스크립트의 종류

/// 문자
let str: string
let red: string = "Red"
let green: string = 'Green'
let myColor: string = `My color is ${red}.`
let yourColor: string = 'Your color is' + green

/// 숫자
let num: number
let integer: number = 6
let float: number = 3.14
let infinity: number = Infinity
let nan: number = NaN

/// 불린
let isBoolean: boolean
let isDone: boolean = false

/// Null / Undefined
let nul: null
let und: undefined
console.log(nul) // undefined (에러)
nul = null
console.log(und) // undefined

/// 배열
const fruits: string[] = ['Apple', 'Banana', 'Cherry']
const numbers: number[] = [1,2,3,4,5,6,7]
const union: (string|number)[] = ['Apple', 1, 2, 'Banana', 3]

/// 객체
const obj: object = {}
const arr: onject = []
const func: object = function () {}
- 거의 사용하지 않음

const userA: {
	name: string
    age: number
    isValid: boolean
} = {
	name: 'Heropy',
    age: 85,
    isValid: true
}

const userB: {
	name: string
    age: number
    isValid: boolean
} = {
	name: 'Neo',
    age: 22,
    isValid: false
}

이런식으로 userA 와 userB는 같은 구조로 작성되어 있는데 항상 이러한 구조로 작성이 될때 반복해서 타입을 작성하면 
번거롭기 때문에 interface를 사용하여 해결할 수 있습니다.

interface User {
	name: string
    age: number
    isValid: boolean
}

const userA: User = {
	name: 'Heropy',
    age: 85,
    isValid: true
}

const userB: User = {
	name: 'Neo',
    age: 22,
    isValid: false
}

/// 함수
const add = function (x: number, y: number): number {
	return x + y
}
const a: number = add(1, 2)

const hello = function (): void {
	console.log('Hello world~')
}
const h: void = hello()

/// Any
let hello: any = 'Hello world'
hello = 123
hello = false
hello = null
hello = {}
hello = []
hello = function () {}

/// Unknown
const a: any = 123
const u: unknown = 123

const any: any = u
const boo: boolean = u (에러)
const num: number = u (에러)
const arr: string[] = u (에러)
const obj: { x: string, y: number } = u (에러)

/// Tuple
const tuple: [string, number, boolean] = ['a', 1, false]

const users: [number, string, boolean][] = [[1, 'Neo', true], [2, 'Evan', false], [3, 'Lewis', true]]

/// Void
= 리턴 키워드가 없는 함수 안에서 반환되는 데이터의 타입입니다.

function hello(msg: string): void {
	console.log(`hello ${msg}`)
}
const hi: void = hello('world')

/// Never
= 절대 발생하지 않을 값

const nev: [] = []
nev.push(3) x

const nev: number[] = []
nev.push(3) o

/// Union
let union: string | number
union = 'Hello type!'
union = 13
union = false // 오류

/// Intersection
interface User {
	name: string,
    age: number
}
interface Validation {
	isValid: boolean
}
const heropy: User & Validation = {
	name: 'Neo',
    age: 85,
    isValid: true
}
post-custom-banner

0개의 댓글