📌 코드 해석

// add 함수 정의, num1과 num2는 number 타입의 매개변수로 정의되며, 리턴값은 void로 정의됨
function add(num1: number, num2: number): void {
  // return num1 + num2 => 리턴값에 대한 타입 지정
  // void => return 없을 때, 사용
  console.log(num1 + num2);
}

위 TypeScript 코드에서 add 함수는 num1과 num2 두 개의 매개변수를 받습니다. 이 두 매개변수는 모두 number 타입입니다. 이 함수는 console.log를 이용해 두 매개변수의 합을 출력합니다.

리턴값이 없는 함수의 경우, TypeScript에서는 void 타입으로 정의합니다. 위 코드에서도 add 함수는 리턴값이 없기 때문에, void 타입으로 정의되어 있습니다.

// 매개변수 name은 선택적 매개변수로, 문자열(string) 타입입니다.
function hello(name?: string) {
  // 템플릿 리터럴(template literal)을 이용해 인사말을 반환합니다.
  // 만약 name이 주어지지 않으면, "world"라는 기본값으로 인사말을 반환합니다.
  return `Hello, ${name || "world"}`;
}

// 매개변수 name은 기본값이 "world"인 문자열(string) 타입입니다.
function hello2(name = 'world') {
  // 템플릿 리터럴(template literal)을 이용해 인사말을 반환합니다.
  return `Hello, ${name}`
}

// hello 함수를 호출하고, 결과값을 result 변수에 할당합니다.
// 매개변수를 주지 않았으므로, 기본값 "world"를 이용해 인사말을 반환합니다.
const result = hello();

// hello 함수를 호출하고, "Sam"을 인수로 전달합니다.
// 인사말을 "Hello, Sam"으로 반환합니다.
const result2 = hello("Sam");

위 TypeScript 코드에서 hello 함수와 hello2 함수는 모두 문자열 타입의 매개변수 name을 받습니다. hello 함수에서는 name 매개변수가 선택적이기 때문에, 호출 시 인수를 전달하지 않을 수도 있습니다. hello2 함수에서는 name 매개변수에 기본값 "world"이 정의되어 있기 때문에, 인수를 전달하지 않으면 "world"가 기본값으로 사용됩니다.

두 함수 모두 템플릿 리터럴(template literal)을 이용해 문자열을 생성합니다. hello 함수에서는 name이 주어지지 않았을 때 기본값 "world"을 이용하며, hello2 함수에서는 매개변수 name에 기본값이 정의되어 있기 때문에 name이 주어지지 않았을 때 기본값인 "world"을 이용합니다.

hello 함수와 hello2 함수를 각각 호출한 결과값은 result 변수와 result2 변수에 각각 할당됩니다. hello 함수에서는 인수를 주지 않았기 때문에, 기본값 "world"이 이용되어 "Hello, world"가 반환됩니다. hello2 함수에서는 인수로 "Sam"을 주었기 때문에, "Hello, Sam"이 반환됩니다.

// 함수 hello는 두 개의 매개변수를 받아서 문자열을 반환하는 함수입니다.
// 첫 번째 매개변수 age는 number 또는 undefined 타입입니다.
// 두 번째 매개변수 name은 반드시 문자열(string) 타입입니다.
function hello(age: number | undefined, name: string): string {
  // 만약 age가 undefined가 아니면, ${age}와 함께 문자열을 반환합니다.
  if (age !== undefined) {
    return `Hello, ${name}. You are ${age}.`;
  } 
  // age가 undefined이면, ${age}를 생략하고 문자열을 반환합니다.
  else {
    return `Hello, ${name}`;
  }
}

// 함수를 호출하고 결과를 출력합니다.
console.log(hello(30, "Sam"));
console.log(hello(undefined, "Sam"));

// Rest parameter를 이용해 가변적인 개수의 인자를 받는 add 함수를 정의합니다.
function add(...nums: number[]) {
  // reduce 메소드를 사용해 nums 배열 내의 모든 요소를 더합니다.
  // reduce 메소드는 인자로 전달된 함수를 실행하여 배열의 모든 요소를 하나의 값으로 축소합니다.
  // 이 함수에서는 현재까지의 합인 result와 현재 요소인 num을 더한 값을 반환합니다.
  return nums.reduce((result, num) => result + num, 0);
}

// 함수를 호출하고 결과를 출력합니다.
add(1, 2, 3); // 6
add(1, 2, 3, 4, 5, 6, 7, 8, 9, 10); // 55

// User 인터페이스를 사용하여 name 속성을 갖는 객체를 정의합니다.
interface User {
  name: string;
}

// Sam 객체를 생성하고 User 타입으로 타입 단언(assertion)합니다.
const Sam: User = { name: 'Sam' };

// showName 함수를 정의합니다.
// 함수의 첫 번째 매개변수는 this를 User 타입으로 제한하는 타입 어노테이션이 적용되어 있습니다.
// 두 번째 매개변수는 나이를, 세 번째 매개변수는 성별을 나타내는 문자열('m' 또는 'f')을 받습니다.
function showName(this: User, age: number, gender: 'm' | 'f') {
  // this.name을 출력합니다. 여기서 this는 User 타입입니다.
  console.log(this.name, age, gender);
}

// showName 함수의 this를 Sam 객체로 지정하여 a 함수에 저장합니다.
const a = showName.bind(Sam);

// a 함수를 호출하면서 나이와 성별을 전달합니다.
a(30, 'm'); // "Sam 30 m"

위 코드는 TypeScript로 작성된 코드로, 인터페이스를 사용하여 User 타입을 정의하고, 이 타입으로 객체를 생성합니다. 그리고 showName 함수를 정의하고, 함수 내에서는 User 타입의 객체의 이름(name)을 출력합니다. 그리고 showName 함수를 호출하기 전에 함수의 this를 bind 메서드를 사용하여 Sam 객체로 지정하여 a 함수에 저장한 후, a 함수를 호출하는 예제입니다.

// User 인터페이스를 사용하여 name과 age 속성을 갖는 객체를 정의합니다.
interface User {
  name: string;
  age: number;
}

// age 매개변수가 string 타입인 경우 string을 반환하는 오버로드된 join 함수를 정의합니다.
function join(name: string, age: string): string;
// age 매개변수가 number 타입인 경우 User 객체를 반환하는 오버로드된 join 함수를 정의합니다.
function join(name: string, age: number): User;
// age 매개변수가 number 또는 string 타입인 경우 User 객체 또는 string을 반환하는 join 함수를 정의합니다.
function join(name: string, age: number | string): User | string {
  // age 매개변수가 number 타입인 경우 User 객체를 반환합니다.
  if (typeof age == "number") {
    return {
      name,
      age,
    };
  } else {
    // age 매개변수가 string 타입인 경우 "나이는 숫자로 입력해주세요."를 반환합니다.
    return "나이는 숫자로 입력해주세요.";
  }
}

// join 함수를 사용하여 User 객체를 생성합니다.
const sam: User = join("Sam", 30);
// join 함수를 사용하여 string을 생성합니다.
const jane: string = join("Jane", "30");

주의할 점은, join 함수는 age 매개변수가 number 또는 string 타입일 경우 각각의 오버로드된 시그니처를 갖는 join 함수가 존재하고, 실제 구현은 age 매개변수가 number 또는 string 타입일 경우 모두 공통으로 사용되는 함수 시그니처에 구현되어 있습니다. 이러한 방식으로 함수 오버로드를 구현하면, 코드의 가독성과 유지보수성이 높아집니다.