Object.fromEntriesを活用してArray#reduceを代替する

JavaScriptにおいて、ある配列をもとにして別のオブジェクトを作成する場合、Array#reduceを使用することが多い。

const input = ['foo', 'bar', 'baz'];

const result = input.reduce((accumulator, currentValue) => {
  accumulator[currentValue] = capitalize(currentValue);
  return accumulator;
}, {});

assert.deepStrictEqual(result, { foo: 'Foo', bar: 'Bar', baz: 'Baz' });

しかし例のように、単にキーと値の組み合わせにマッピングするだけなら、あえてArray#reduceを使うまでもない。代わりにObject.fromEntriesを使えば、記述するコードをもっとシンプルにできる。

const input = ['foo', 'bar', 'baz'];

const result = Object.fromEntries(input.map((element) => [element, capitalize(element)]));

assert.deepStrictEqual(result, { foo: 'Foo', bar: 'Bar', baz: 'Baz' });

まず配列を「キーと値のペアからなる配列」([key, value][])に変換してから、それをObject.fromEntriesに渡すことでオブジェクト化できる。

Object.fromEntriesObject.entriesの対になるメソッドである。Object.entriesは、オブジェクトを「キーと値のペアからなる配列」に変換するものであるのに対して、Object.fromEntriesはその逆に、「キーと値のペアからなる配列」をオブジェクトに変換する。

ついでに、TypeScriptではArray#reduceを使うと型の取り扱いがやや煩雑になるが、Object.fromEntriesを使うとそのような問題が起こらない。