https://zenn.dev/yuku/articles/b169ac62ac3271

最近、TC39 で Dataflow Proposals と呼ばれる5つのプロポーザルが議論されている。これらはパラダイムをも変えうる大きな提案で、議論も結構おもしろいので紹介する。

この記事では2022/05時点での以下の内容を紹介する。

• 各プロポーザルの概要・モチベーション・論点
• 全体的な論点

以下のことは詳しく書かないので、ぜひ各自でディグってほしい。

• 各プロポーザルの詳細な仕様
• 過去の経緯

Dataflow Proposals とは

以下の5つのプロポーザルをまとめて Dataflow Proposals と呼んでいる。

例えば Pipe operator, Call-this operator, Partial application を組み合わせると、以下のように書けるようになる。（提案段階なので変わる可能性アリ）

import { getAuth, getIdToken } from "firebase/auth";

function isPublic(article) {
  return article.isPublic;
}

async function getIdTokenFromAuth() {
  return await getIdToken(this.currentUser);
}

// Before
const publicArticles1 = (await fetch("/articles", {
  headers: { Authorization: await getIdTokenFromAuth.call(getAuth()) },
})).filter((a) => isPublic(a));

// After
const publicArticles2 = getAuth()
  ~> getIdTokenFromAuth()
  |> await fetch("/articles", { headers: Authorization: @ })
  .filter(isPublic~(?));

このコードは getAuth→getIdTokenFromAuth→fetch→filter という順番で実行される。 見慣れない演算子や記号があって驚くかもしれないが、コードを左から右、上から下へと自然に読んでいくと、それが関数の実行順と一致していて読みやすいと思う。

このように、コードの実行順やデータの流れ(Dataflow)を整理するようなプロポーザルが Dataflow Proposals としてまとめて議論されている。

各プロポーザルについて

概要

このプロポーザルでは、パイプ演算子 |> とトピックリファレンス @ を追加し、以下のように書けるようになる。

// Before
const publicArticles1 = (await fetch("/articles", {
  headers: { Authorization: await getIdTokenFromAuth.call(getAuth()) },
})).filter((a) => isPublic(a));

// With Pipe operator
const publicArticles2 = getIdTokenFromAuth.call(getAuth())
  |> await fetch("/articles", { headers: Authorization: @ })
  .filter((a) => isPublic(a));

まず |> の左辺式が評価される。そして、その結果が右辺のトピックリファレンス @ に束縛され、右辺式が評価される。