함수 오버로드

이름이 같고, 매개변수 타입과 반환 타입이 다른 여러 함수를 만들 수 있다.
다양한 구조의 함수를 생성하고 관리할 수 있다.

1️⃣ 선언부
function add(a:string, b:string):string;
function add(a:number, b:number):number;

2️⃣ 원형
function add(a:any, b:any):any{
	return a+b;
}

예시

interface Person{
	name: string;
	age: number;
}
function join(name:string, age:string):string;
function join(name:string, age:number):Person;
function join(name:string,age:number|string):Person|string{
	if(typeof age==="number"){
		return{
			name:name,
			age:age
		}
	}else{
		return '나이는 숫자로 입력하세요';
	}
}
const green:Person= join("green",30);
const blue= join("blue","hi");

제네릭

재사용을 목적으로 함수나 클래스의 선언 시점이 아닌 사용 시점에 타입을 선언한다.
타입을 인수로 받아서 사용한다.
타입 변수는 사용자가 제공한 타입으로 변환될 식별자이다.

1️⃣ 작성
function 함수명<제네릭 타입 변수명A>(매개변수:제네릭타입변수명A):타입{
	return 문
}

2️⃣ 사용
함수명<변수의 타입 지정>(변수);

👉 위에서는 <변수의 타입 지정>에 입력한 타입이 매개변수의 타입이 된다.

type U= string | number
interface Mytype<U>{
  age: number;
}

👉 위와 같이 type을 미리 선언할 수도 있다.

예시

함수와 제네릭

function getSize<T>(arr:T[]):number{
	return arr.length;
}

const arr1:number[]= [1,2,3];
getSize<number>(arr1);
const arr2=["a","b","c","d"];
getSize<string>(arr2);
const arr3:object[]=[{ket:'s'},{godi:"so"}];
getSize<object>(arr3);

interface와 제네릭

interface Animal<T>{
	name:string;
	color: string;
	option: T;
}
const animal1: Animal<{age:number,hobby:string}>={
	name:"puppy",
	color:"#fff",
	option:{
		age: 3,
		hobby: "공놀이"
	}

제약조건 extends

제네릭 + extends

<T extends number | string>

👉 제네릭 변수 T에 지정할 수 있는 타입을 number 타입, string 타입으로만 지정한다.

인터페이스 + extends

interface