Cybozu Frontend Monthly #16

イベント概要

サイボウズフロントエンドマンスリー は、サイボウズ社内で行っているフロントエンド情報共有会「フロントエンドウィークリー」の公開版です。

その月に気になったフロントエンドの情報を、サイボウズのフロントエンドエキスパートチームのメンバーが共有していきます。

このイベントのハッシュタグは #サイボウズフロントエンドマンスリーです。

※フロントエンドウィークリーとは

毎週火曜の 17:00 〜 18:00 で社内向けに行っているフロントエンドの気になる記事を紹介する会です。2016年3月15日から行われています。
ハッシュタグ #サイボウズフロントエンドウィークリーで実況しています。

zennのpublicationにてウィークリーのまとめも投稿していますので、ぜひこちらもご覧ください。 https://zenn.dev/p/cybozu_frontend

開催日

2021年10月26日

イベントページ

https://cybozu.connpass.com/event/228079/

配信URL

https://www.youtube.com/watch?v=BMbJ0hYy3G8

メンバー

コンテンツ

💬 Languages

agendas/10.md at master · tc39/agendas

詳細

for Stage 4

Error Cause

function doWork() {
  try {
    doSomeWork();
  } catch (err) {
    throw new Error("Some work failed", { cause: err });
  }
  try {
    doMoreWork();
  } catch (err) {
    throw new Error("More work failed", { cause: err });
  }
}

for Stage 3

なし

for Stage 2

Array Grouping

const array = [1, 2, 3, 4, 5];
array.groupBy((i) => {
  return i % 2 === 0 ? "even" : "odd";
});
// =>  { odd: [1, 3, 5], even: [2, 4] }

Partial Application

const add = (x, y) => x + y;
const addOne = add~(1, ?);
addOne(2); // 3

for Stage 1

`String.cooked`

String.cooked`mmm ... \u0064elicious cooked string`;
// → "mmm ... delicious cooked string"

Destructure Private Fields

class Foo {
  #x = 1;
  constructor() {
    console.log(this.#x); // => 1
    const { #x: x } = this;
    console.log(x); // => 1
  }
}

Bind-this operator

Object.prototype.hasOwnProperty.call({ foo: "foo" }, "foo"); // true
({ foo: "foo" }::Object.prototype.hasOwnProperty("foo")); // true

Function helpers

const f = Function.flow(f0, f1, f2);
f(5, 7); // f2(f1(f0(5, 7))).

Function.pipe(5, f0, f1, f2); // f2(f1(f0(5))).

const f = Function.constant(3);
f("fooo"); // 3
f(3009, 33, 44); // 3
f({ foo: "foo" }); // 3

Function.identity(3); // 3
Function.identity(4, 5); // 4

const f = Function.tap(console.log);
f(5); // 5 を出力して、5 を返す

Evaluator Attributes

import mod from "./foo.wasm" as "wasm-module";
mod instanceof WebAssembly.Module; // true

RegExp Features

前回のミーティングで提案されたRegExp Featuresが機能ごとに別々の提案に分割された。