타입스크립트 변수와 함수 타입 정의

문자, 숫자, 배열

const str: string = 'hello'
const num: number = 10
const arr: Array<number> = [1,2,3]
const arr2: Array<string> = ['가', '나', '다', 10] //error
const arr3: number[] = [4,5,6]

- 배열은 Array<T>로 사용해줘도 되지만 타입+배열 리터럴로도 해줄 수 있다. 

 

---

튜플, 객체, 진위값

// TS 튜플
const address: [string, number] = ['gangnam', 100]

- 튜플은 배열 index에 타입 뿐 아니라 각 요소의 타입도 지정해 줄 수 있다. 

- 배열의 길이가 고정되고 각 요소의 타입이 지정되어 있는 배열 형식을 의미

 

// TS 객체
let obj: object = {}

let person: object = {
    name: 'cap',
    age: 100
}

- 객체는 타입에 object 써준다. 만약에 object의 속성에 타입을 주고 싶다면?

 

let person: {name:string, age: number} = {
    name: 'cap',
    age: 100
}

- 구체적으로 객체의 속성 타입까지 지정할 수 있다. 

- 변수안에 속성 값을 적지 않게되면 에러문구가 확인된다. 

 

// TS 진위값

let show: boolean = true

---

함수

- 함수의 파라미터 타입

- 함수의 반환 타입

- 함수의 구조 타입

 

//함수의 기본타입 선언
function sum(a: number, b: number) {
    return a + b
}

sum(10, 20)
sum(10, 20, 30) error
sum(10) error

 

//함수 반환값에 타입 지정
const add = (): number => {
    return 10
}

const result = (a: number, b: number): number => {
    return a + b
}

---

javascript의 유연한 특성 중 하나는 정의되어 있는 함수 호출 시 인자를

로직에 있는 파라미터 개수에 맞게 넣지 않아도된다. 

이런 부분은 타입스크립트에서 조금 더 엄격하게 체크해준다.

 

 

함수의 인자

ts에서는 함수의 인자를 모두 필수 값으로 간주한다. 

(파라미터의 개수에 맞게 인자의 값을 넣어야 한다. )

 

undefined나 null이라도 인자로 넘겨야한다. 

이럴 때 파라미터에 옵셔널을 해준다. 

//파라미터 타입에 옵셔널추가
function sum(a: number, b?: number) {
    return a + b
}

sum(10, 20) //30 
sum(10, 20, 30) error
sum(10) //타입 에러 없음

선택적으로 있거나 없거나 하는 상황에서 파라미터에 물음표를 붙여준다. 

 

[옵셔널 체이닝(Optional Chaining)]

null이나 undefined인 값이 반환되면 즉시 중단하고 undefined를 반환하는 문법이다.

오류 없이 바로 undefined를 반환 한다. (undefined 와 null 은 Falsy 한 값)

 

 

REST PARAMETER 적용된 매개변수