Generic - 타입을 파라미터로

크롱·2023년 7월 27일
0

TypeScript

목록 보기
16/25

💙 Generic

🥺 왜 쓰나요?

				어떤 자료가 들어올지모르니,unknown
function 함수(x :unknown[]){
	return x[0]
}

let a = 함수([4,2]) //a는 4
a+1 //오류뜸 ㅠㅠ

이때 a의 타입은 number일까요? 🙅‍♂️
unknown 입니다. (이미 내가 unknown으로 지정함)

그래서 a+1 이런식으로 하면 오류가 납니다.
해결방법으로 Generic 함수를 만들어 봅시다.


function 함수<MyType>(x :Mytype[]) :Mytype{
	return x[0]
}
let num = 함수<number>([4,2])
console.log(num+1) //5

😈😈 MyType에 number가 들어갑니다. 😈😈


💚 Generic 타입 제한 (constraints)

function 함수<MyType>(x :MyType){
	return x-1
}

let a = 함수<number>(100) 
==> 이거 안됨 ㅠㅠ 👇왜냐면
<MyType> 이라는 곳에 number 말고도 
다른거 혹시 집어넣을 수 있으니까 저런 - 1 연산을 미리 방지해주는 것입니다. 

👇해결👇
extends


		✅MyType이 우측 속성number를 가지고 있는지 체크✅
function 함수<MyType extends number>(x :MyType){
	return x-1
}

let a = 함수<number>(100) 



🛂다른 예제 코드🛂 - interface

interface LengthCheck {
	length:number
}

function 함수<MyType extends LengthCheck>(x: MyType){
	return x.length
}

let a = 함수<string[]>(['100'])


🔆 연습문제

  1. 문자를 집어넣으면 문자의 갯수, array를 집어넣으면 array안의 자료 갯수를 콘솔창에 출력해주는 함수는 어떻게 만들까요?

함수<string>('hello') 이렇게 사용하면 콘솔창에 5가 나와야합니다.

함수<string[]>( ['kim', 'park'] ) 이렇게 사용하면 콘솔창에 2가 나와야합니다.

function 함수<MyType extends string | string[]>(x: MyType)  { 
     console.log(x.length)   
} 

함수<string>('hello');
함수<string[]>(['kim','park'])



2번.

interface Animal {
  name : string;
  age : number 
}

let data = '{"name" : "dog", "age" : 1 }';


function 함수<Type>(x :string) :Type {
  return JSON.parse(x);
}
let result = 함수<Animal>(data)
console.log(result)


3번.
지금 만든 class는 new Person('어쩌구') 라고 분명 문자를 집어넣었는데 any 타입이 name 속성에 부여됩니다.

이게 싫어서 파라미터에 string을 집어넣으면 string 타입
number를 집어넣으면 number 타입
string[]을 집어넣으면 string[] 타입이 되게 하려면 위의 코드를 어떻게 수정해야할까요?

class Person <T> {
  name;
  constructor(a :T){
    this.name = a;
  }
}
let a = new Person<string>('어쩌구');
a.name //string 타입이 되었넹 
profile
👩‍💻안녕하세요🌞

0개의 댓글