G's days

Typescript - rest파라미터, 오브젝트 destructuring할 때 타입 지정 본문

일지

Typescript - rest파라미터, 오브젝트 destructuring할 때 타입 지정

Hi☆G 2021. 9. 26. 18:13

rest parameter

//rest parameter : 파라미터 무한 (가장 뒤에써준다)

function 함수(...a) {

}

//rest parameter 파라미터 타입지정 ( 배열로 한다 )

function 함수(...a :number[]) {

}

destruncturing 개념

// destrucuring 쓰지 않을 때 

let 어래이 = ['안녕', 100]
console.log(어래이[0])
console.log(어래이[1])

// destrucuring 쓸 때 ====> 배열 자료들을 변수로 빼서 쉽게 쓸 수 있음

let [변수,1 변수2] = ['안녕', 100] 
console.log(변수1)
console.log(변수2)


//오브젝트 destructuring

let { student:student, age:age } = { student : true, age: 20 }

let { student, age } = { student : true, age : 20 }  // 위와 같다


// 함수 파라미터에 destructuring 가능

   // destructuring 사용 하지 않을 때
   
   let 오브젝트 = { student : true, age: 20 }
   
   function 함수(a, b) {
   	console.log(a, b)
   }
   함수(오브젝트.student, 오브젝트.20) // 콘솔창 출력값: true, 20

   // destructuring 사용
   
   let 오브젝트 = { student : true, age: 20 }
    
   function함수({ student, age }) {
   	console.log(student,age)
   }
   함수({ student : true, age : 20 }) // 콘솔창 출력값 : true, 20 
 //따라서
   함수(오브젝트) // 콘솔창 출력값 : true, 20
   
   // 타입지정
   
    type StudentType = {
     student : boolean,
     age : number
    }

    function 함수({student, age} : { student:boolean, age:number }){  }
    function 함수({student, age} : StudentType) {  }
    const 함수: StudentType = ({ student, age }) => {  }
    const 함수:React.FC<StudentType> = ({ student, age }) => {  }