Cybozu Frontend Monthly #16

イベント概要

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

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

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

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

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

開催日

2021年10月26日

イベントページ

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

配信URL

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

タイムテーブル

07:50 - 08:00配信開始
08:00 - 08:05オープニング
08:05 - 08:55本編
08:55 - 09:00クロージング

メンバー


紹介記事

💬 Languages

詳細

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が機能ごとに別々の提案に分割された。

Updates

その他


⚒️ Libraries / Frameworks


🖥 Browsers


🎨 Design


📝 Blogs


🦆 Tips

フロントエンドエキスパートチームについて

https://speakerdeck.com/cybozuinsideout/frontendexpert-team