TypeScript で Fizz Buzz に挑む #TypeScript #FizzBuzz

TypeScript で Fizz Buzz に挑む

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

TypeScript で Fizz Buzz に挑む

Fizz Buzz とは

プログラミング学習でよく見る 入門用プログラムです

くわしくは 下記を参考にしてください
https://ja.wikipedia.org/wiki/Fizz_Buzz

TypeScript で Fizz Buzz コードを書いてみます

  • type を多めに宣言してます
  • main の処理はあっさりな感じです
// ジェネリクス型
type Maybe<T> = T | "";

// アプリの肝となる型
type Fizz = "Fizz";
type Buzz = "Buzz";
type FizzBuzz = Fizz | Buzz | "FizzBuzz";
type Result = FizzBuzz | string;

// ジェネリクス型を利用して冗長のない定義
// extendsでの型制約
type FB<T extends Fizz | Buzz> = (p: number) => Maybe<T>;

// 実処理の型
type Main = (p: number) => string;
type Game = (p: undefined, p2: number) => Result;

// Type Guard用
type IsFizzBuzz = (p: string) => boolean;

// アプリの肝となる処理
const fizz: FB<Fizz> = p => (p % 3 === 0 ? "Fizz" : "");
const buzz: FB<Buzz> = p => (p % 5 === 0 ? "Buzz" : "");

// Type Guard
const isFizzBuzz: IsFizzBuzz = (p): p is FizzBuzz => p.length > 0;

// ドメイン相当
const game: Game = (_, i) => {
  // 0 始まり 調整
  const k = i + 1;

  // Fizz Buzz を Array の中で作り -> 連結
  const r = [fizz(k), buzz(k)].join("");

  // Type Guard で TSに出来ないことは 自分でする
  return isFizzBuzz(r) ? r : k.toString();
};

// エンドポイント 
const main: Main = p => [...Array(p)].map(game).join(", ");

const suitableValue = 16;
alert(main(suitableValue));

TypeScript で Fizz Buzz コードを動かしてみる

Playground

ペースト -> Run してみてください

まとめ

最初は簡単なプログラムを作ってみるのがおすすめです