関数のタイプ

関数のタイプ

function getInfoText(name: string, age: number): string {
  // 매개 변수 타입과 반환 타입 지정
  const nameText = name.substr(0, 10); // 매개변수 name은 문자열 타입이기 때문에 substr 사용 가능
  const ageText = age >= 35 ? 'senior' : 'junior'; // 매개변수 age는 숫자이기 때문에 다른 숫자와 크기 비교 가능

  return `name: ${nameText}, age: ${ageText}`;
}
const v1: string = getInfoText('mike', 23);
const v2: string = getInfoText('mike', '23'); // TypeError
const v3: number = getInfoText('mike', 23); // TypeError

変数を関数タイプとして保存

const getInfoText: (name: string, age: number) => void = function (name, age) {
 	// ...
};

パラメータの選択

function getInfoText(name: string, age: number, language?: string): string {
  const nameText = name.substr(0, 10);
  const ageText = age >= 35 ? 'senior' : 'junior';
  const languageText = language ? language.substr(0, 10) : '';

  return `name: ${nameText}, age: ${ageText}, language: ${languageText}`;
}
const v1: string = getInfoText('mike', 23, 'ko');
const v2: string = getInfoText('mike', 23); // language에 해당하는 인수는 반드시 입력하지는 않아도 괜찮다.
const v3: number = getInfoText('mike', 23, 123); // Type Error

function getInfoText(name: string, language?: string, age: number): void {
  // 매개변수 age에서 타입 에러 발생!
}

function getInfoText(name: string, language: string | undefined, age: number): void {
  // ...
}

残りのパラメータ

function getInfoText(name: string, ...rest: string[]): void {
  // ...
}

このタイプ

// this타입을 정의하지 않은 코드
function getParam(this: string, index: number): string {
  const params = this.splt(',');
  if (index < 0 || params.length <= index) return '';

  return this.split(',')[index];
}

// this타입을 정의한 코드
function getParam(this: string, index: number): string {
  const params = this.splt(','); // 타입 에러 발생
  if (index < 0 || params.length <= index) return '';

  return this.split(',')[index];
}

元のタイプにメソッドを追加

interface String {
  getParam(this: string, index: number): string; // 인터페이스를 이용해 이미 존재하는 문자열 타입에 getParam 메서드를 추가한다.
}

String.prototype.getParam = getParam; // 문자열의 프로토타입에 작성한 함수를 등록한다.
console.log('asdf, 1234, ok '.getParam(1)); // 이제 문자열에 등록된 getParam 메서드를 호출할 수 있다.

関数のリロードかんすうのさいか:複数のタイプを定義するふくすうのたいぷをていぎする

function add(x: number | string, y: number | string): number | string {
  if (typeof x === 'number' && typeof y === 'number') return x + y;
  else {
    const result = Number(x) + Number(y);
    return result.toString();
  }
}

const v1: number = add(1, 2); // Type Error - 모든 매개변수가 숫자이면 반환값도 숫자이지만 Type Error가 발생한다.
console.log(add(1, '2')); // 두 매개변수의 타입이 달라도 Type Error가 발생하지 않는다.

// 매개변수와 반환 타입의 모든 가능한 조합을 정의한다.
function add(x: number, y: number): number;
function add(x: string, y: string): string;

// 실제 구현하는 쪽에서 정의한 타입은 함수 오버로드의 타입 목록에서 제외된다.
function add(x: number | string, y: number | string): number | string {
  if (typeof x === 'number' && typeof y === 'number') return x + y;
  else {
    const result = Number(x) + Number(y);
    return result.toString();
  }
}

const v1: number = add(1, 2);
console.log(add(1, '2')); // TypeError: 두 매개변수의 타입이 다르면 타입에러가 발생한다.

名前付きパラメータ

// 우선 모든 매개변수의 이름을 정의한다.
function getInfoText({
  name,
  age = 15,
  language,
}: // 앞에 나열된 모든 매개변수에 대한 타입을 정의한다.
{
  name: string;
  age?: number;
  language?: string;
}): string {
  const nameText = name.substr(0, 10);
  const ageText = age >= 35 ? 'senior' : 'junior';

  return `name: ${nameText}, age: ${ageText}, language: ${language}`;
}

interface Param {
  name: String;
  age?: number;
  language?: string;
}

function getInfoText({ name, age = 15, language }: Param): string {
  const nameText = name.substr(0, 10);
  const ageText = age >= 35 ? 'senior' : 'junior';

  return `name: ${nameText}, age: ${ageText}, language: ${language}`;
}