小規模なSPAをつくってみてわかったFable(F# -> JS)の良いところ

function maybe<A, B>(
  whenNone: () => B,
  whenSome: (a: A) => B,
  fa: Option<A>
): B {
  switch (fa._tag) {
    case "None":
      return whenNone();
    case "Some":
      return whenSome(fa.value);
  }
}

//        ↓ type parameter
type List<A> = { type: "Nil" } | { type: "Cons"; head: A; tail: List<A> };
//                                                              ↑ recursion

const fold = <A, R>(
  fa: List<A>,
  onNil: () => R,
  onCons: (head: A, tail: List<A>) => R
): R => (fa.type === "Nil" ? onNil() : onCons(fa.head, fa.tail));

const length = <A>(fa: List<A>): number =>
  fold(
    fa,
    () => 0,
    (_, tail) => 1 + length(tail)
  );

[<Literal>]
let Three = 3

let filter123 x =
    match x with
    // The following line contains literal patterns combined with an OR pattern.
    | 1 | 2 | Three -> printfn "Found 1, 2, or 3!"
    // The following line contains a variable pattern.
    | var1 -> printfn "%d" var1

for x in 1..10 do filter123 x

const displayName = "e_ntyo";
const user = { displayName };
const tagged = `Hello! I am ${displayName}`; // "Hello! I am e_ntyo"
const tagged2 = `Hello! I am ${user}`; // "Hello! I am [object Object]" <- 勝手にtoString()されている

type User = { DisplayName: string }

let displayName = "e_ntyo"
let user = { DisplayName = displayName; }
let tagged = displayName |> sprintf "Hello! I am %s"; // "Hello! I am e_ntyo"
let tagged2 = user |> sprintf "Hello! I am %s"; // The type 'User' does not match the type 'string'

function compose<A, B, C>(f: (arg: A) => B, g: (arg: B) => C): (arg: A) => C {
  return x => g(f(x));
}

interface Person {
  name: string;
  age: number;
}

function getDisplayName(p: Person) {
  return p.name.toLowerCase();
}

function getLength(s: string) {
  return s.length;
}

// has type '(p: Person) => number'
const getDisplayNameLength = compose(getDisplayName, getLength);

// works and returns the type 'number'
getDisplayNameLength({ name: "Person McPersonface", age: 42 });

// Write code or load a sample from sidebar
type Person = {
    Name: string;
    Age: int;
}

let getDisplayName (p: Person) =
  p.Name.ToLower()

let getLength (s: string) =
  s.Length

let getDisplayNameLength = getDisplayName >> getLength

getDisplayNameLength { Name = "Person McPersonface"; Age = 42 };

compose(compose(compose(f, g), h), i);

f >> g >> h >> i

module Main where

import Prelude

import Data.Either (Either(..))
import Data.Maybe (Maybe(..))
import Effect (Effect)
import Effect.Console (log)

f :: Maybe Boolean -> Either Boolean Boolean -> String
f a b = case a, b of
  Just true, Right true -> "Both true"
  Just true, Left _ -> "Just is true"
  Nothing, Right true -> "Right is true"
  _, _ -> "Both are false"

main :: Effect Unit
main = do
  log $ f (Just true) (Right true) -- Both true

// Generated by purs version 0.13.6
"use strict";
var Data_Either = require("../Data.Either/index.js");
var Data_Maybe = require("../Data.Maybe/index.js");
var Effect_Console = require("../Effect.Console/index.js");
var f = function (a) {
    return function (b) {
        if (a instanceof Data_Maybe.Just && (a.value0 && (b instanceof Data_Either.Right && b.value0))) {
            return "Both true";
        };
        if (a instanceof Data_Maybe.Just && (a.value0 && b instanceof Data_Either.Left)) {
            return "Just is true";
        };
        if (a instanceof Data_Maybe.Nothing && (b instanceof Data_Either.Right && b.value0)) {
            return "Right is true";
        };
        return "Both are false";
    };
};
var main = Effect_Console.log(f(new Data_Maybe.Just(true))(new Data_Either.Right(true)));
module.exports = {
    f: f,
    main: main
};

// http://www.fssnip.net/ji/title/Either-in-F
[<AutoOpen>]
module Either

type Either<'a, 'b> =
    | Left of 'a
    | Right of 'b

type either<'a, 'b> =
    Either<'a, 'b> // lower-case alias like option

let isLeft = function
  | Left _ -> true
  | _      -> false

let isRight = function
  | Right _ -> true
  | _      -> false

let f (fa: Option<bool>) (fb: Either<bool, bool>) =
  match fa, fb with
  | (Some true), (Right true) -> "Both true"
  | (Some true), (Left _) -> "Some is true"
  | None, (Right true) -> "Right is true"
  | _, _ -> "Both are false"

f (Some true) (Right true) |> printfn "%s"

import { declare, Union } from "fable-library/Types.js";
import { union } from "fable-library/Reflection.js";
import { toConsole, printf } from "fable-library/String.js";
export const Either$00602 = declare(function Either_Either(
  tag,
  name,
  ...fields
) {
  Union.call(this, tag, name, ...fields);
},
Union);
export function Either$00602$reflection($gen$$1, $gen$$2) {
  return union("Either.Either`2", [$gen$$1, $gen$$2], Either$00602, () => [
    ["Left", [$gen$$1]],
    ["Right", [$gen$$2]]
  ]);
}
export function isLeft(_arg1) {
  if (_arg1.tag === 0) {
    return true;
  } else {
    return false;
  }
}
export function isRight(_arg1$$1) {
  if (_arg1$$1.tag === 1) {
    return true;
  } else {
    return false;
  }
}
export function f(fa, fb) {
  var $target$$7;

  if (fa == null) {
    if (fb.tag === 1) {
      if (fb.fields[0]) {
        $target$$7 = 2;
      } else {
        $target$$7 = 3;
      }
    } else {
      $target$$7 = 3;
    }
  } else if (fa) {
    if (fb.tag === 0) {
      $target$$7 = 1;
    } else if (fb.fields[0]) {
      $target$$7 = 0;
    } else {
      $target$$7 = 3;
    }
  } else {
    $target$$7 = 3;
  }

  switch ($target$$7) {
    case 0: {
      return "Both true";
    }

    case 1: {
      return "Some is true";
    }

    case 2: {
      return "Right is true";
    }

    case 3: {
      return "Both are false";
    }
  }
}

(function() {
  const arg10 = f(true, new Either$00602(1, "Right", true));
  const clo1 = toConsole(printf("%s"));
  clo1(arg10);
})();

const path = require("path");

module.exports = {
  mode: "development",
  entry: "./src/App.fsproj",
  devtool: "  source-map",
  output: {
    path: path.join(__dirname, "./public"),
    filename: "bundle.js"
  },
  devServer: {
    publicPath: "/",
    contentBase: "./public",
    port: 8080
  },
  module: {
    rules: [
      {
        test: /\.fs(x|proj)?$/,
        exclude: "/node_modules/",
        use: {
          loader: "fable-loader",
          options: {
            babel: {
              presets: [
                [
                  "@babel/preset-env",
                  {
                    modules: false
                  }
                ]
              ]
            }
          }
        }
      }
    ]
  },
  optimization: {
    usedExports: true
  }
};

{
  "sourceMaps": true,
  "targets": {
    "production": {
      "sourceMaps": false
    }
  },
  "module": "es2015",
  "ecma": "es2015"
}