【TypeScript入門】基本的な関数の使い方7選！コードを用いて徹底解説

// (a:第１引数の型, b:第２引数の型):戻り値の型
function sum(a: number, b:number):number {
  return a + b;
}
console.log(sum(10,20)) //実行結果：30

// [関数sum]に対して型を指定できる
let sum: (a: number, b: number) => number = function (
  a: number,
  b: number
): number {
  return a  + b;
};

console.log(sum(10, 20)); //実行結果：30

// 従来の関数とは書き方が異なる
let sum: (a: number, b: number) => number =  (
  a: number,
  b: number
): number => {
  return a  + b;
};

// ラムダ式（returnを省略して書ける）
let sum: (a: number, b: number) => number =  (
  a: number,
  b: number
): number => a  + b;

console.log(sum(10, 20)); //実行結果：30

// 引数の隣に[?]を記述することで、値を省略可能にする
let sum: (a: number, b: number, c?:number) => number =  (
  a: number,
  b: number,
  c?: number,
): number => {
  if (c) return a + b + c
  return a + b;
};

console.log(sum(10, 20)); //実行結果：30
console.log(sum(10, 20, 30)); //実行結果：60

// 引数にデフォルト値を指定できる
let sum = ( a: number = 10, b: number = 20): number => {
  return a + b;
};

console.log(sum()); //実行結果：30

// previousValue(累積値) currentValue(現在処理されている要素）
const reducer = (previousValue: number, currentValue: number) => {
  return previousValue + currentValue;
};

// [...values] = 残余引数(不定数の引数を配列として受け取る）
const sum: (...values: number[]) => number = (...values: number[]): number => {
  // reduce = 配列データの各要素を累積して1つの値にする関数
  const result = values.reduce(reducer);
  return result;
};

console.log(sum(1, 2, 3, 4, 5)); //実行結果：15

// 関数を定義する際の名前は同じだけど、引数や戻り値の値が違うもの

// 関数の前に型を宣言する(シグネチャー)
function foo(value: string): string;
function foo(value: number): number;

// シグネチャーで宣言した関数以外はやってこない - だからany型で良い
function foo(value: any): any {
  if (typeof value === "string") {
    return value + value;
  } else {
    return value * 2;
  }
}

console.log(foo("Nice! ")); //実行結果 Nice! Nine!
console.log(foo(100)); // 200