Typescript rest parameter / destructuring일 때 타입지정은?_part6

 

안녕하세요,

오늘은 rest parameter / destructuring에 대한 간단한 개념설명과 타입스크립트에서 타입지정하는 방법을 알아보려함다

 

<목표>

rest parameter 간단 개념, 타입지정

destructuring 간단 개념, 타입지정

 

 

| rest parameter란?

함수를 쓸 때 함수 (1,2,3,4,.... ) -> 몇개의 파라미터가 올지 모르는 경우가 있을 때

몇개의 파라미터가 들어올지 모를때파라미터를 무한히 지정하는 것이아니라 ...a 이런 식으로 지정하는 것. rest parameter이다. 파라미터 몇십몇만 들어올 수 있는 rest parameter.

function 함수(...x){

}

함수(1,2,3,6,8,7,6)

 

 

근데, 이 rest 파라미터를 사용할 경우 다른 파라미터와 같이 있을 때는 맨 뒤로 옮겨 놓아야합니다.

맨 뒤에서만 사용 할 수 있음 이런 식으로요

function 함수2(hi, ...x){

}
함수2(1,2,3,6,8,7,6)

 

 

 

그럼, 이 rest parameter 타입지정은 어떻게 할까?

number만 들어올 수 있도록

function 함수3(...x:number[]){
    console.log(x)
}

함수3(1,3,2,4,5,6)

 

 

| ...spread operator란

1 사용법: 함수 안에 쓰면 rest parameter

2 사용법 : Array나 Object에 쓰면 괄호를 벗길 수 있습니다.

let 배열 = [2,3,4,5];

let 배열2 = [6,7,8,9];

let 배열3 = [...배열, ...배열2]

//...spread operator에서는 괄호를 벗겨줘서

//console.log(배열3)하면 [2,3,4,5,6,7,8,9] 가 나옵니다.

//짚고 넘어가면

//...spread operator ...rest parameter은 다른 문법이라는 것, 참고~

 

 

| destructuring이란?

let 배열4 = ['hello', 20] //이 자료들을 변수로 빼서 쓰려한다면


//안에 있는 것을 쉽게 빼내랑법은

let [변수1, 변수2] = ['hello', 20]
console.log(변수1)

 

 

오브젝트일 경우 변수로빼고 싶을 때

let {student, age} = {student : true, age : 12}
let 오브젝트 = { student : true, age : 20}

function 함수5({student, age}){
    console.log(student, age)
}

함수5({student : true, age : 12})

변수를 만들 때 {student, age}라고 하면

파라미터로 들어오는 {student, ??}는 student라는 변수에 저장,

{age : ???}는 age라는 변수에 저장해. 라는 뜻입니다.