特定のプロパティを除外した新しいオブジェクトを作る（immutableなdelete）

ECMAScript

あるオブジェクトから、特定のプロパティのみ除外した新しいオブジェクトを作りたい場合がある。

const p1 = {
  x: 0,
  y: 1,
  z: 2,
};

// p1からzプロパティを除外した新しいオブジェクトを作る

const p2 = Object.assign({}, p1);
delete p2.z;

console.log(p2); // { x: 0, y: 1 }


最近の実装（およびtranspile前提の環境）であればECMAScriptのObject Rest Destructuringを使うことで、外部ライブラリやユーティリティ関数を用意しなくても1行で書くことができる。

const { z, ...p2 } = p1;

console.log(p2); // { x: 0, y: 1 }


格納されるプロパティのキーや取り除きたいプロパティのキーが動的な場合は、ComputedPropertyNameと組み合わせることになる。

const key = 'z';

const { [key]: _, ...p2 } = p1;

console.log(_); // 2
                // うーん……


取り除かれたプロパティの値は使わないよという表明で`_`にしたけど、そもそも余計な定数が定義されないようにしたい。そこでさらに空の分割代入を行う。

const key = 'z';

const { [key]: {}, ...p2 } = p1; // {}の代わりに[]でも可

// 不要な定数は定義されない!


これでよし！と思いきや、keyのプロパティが存在しなかったり、値がundefinedだった場合にエラーが起きてしまう。

const p1 = {
  x: 0,
  y: 1,
};

const key = 'z';

const { [key]: {}, ...p2 } = p1; // TypeError: p1[(intermediate value)] is undefined


ということでデフォルト値を指定する。

const p1 = {
  x: 0,
  y: 1,
};

const key = 'z';

const { [key]: {} = {}, ...p2 } = p1; // 問題なし!

これでよし！ただし、プロパティの値がnullの場合はデフォルト値が採用されず、先ほどと同様にTypeErrorが投げられてしまうので、値にnullが含まれ得るオブジェクトには使えない。


そのままreturnする場合などは、IIFEで引数をdestructuringすれば1文で書けるけど、ここまでくるとさすがにやりすぎな感じがする。

switch (action.type) {
  case 'PAGE_CLOSE':
    return (({ [action.id]: {} = {}, ...nextState }) => nextState)(state);

  // ...
}
改めて考えると、IIFEを使う場合はローカル変数のことを気にする必要はないから、_で問題なかった。 
switch (action.type) {
  case 'PAGE_CLOSE':
    return (({ [action.id]: _, ...nextState }) => nextState)(state);

  // ...
}

書き捨てではない・読まれるコードでは、lodash/fpのomitなどを使おう……。

TypeScriptでもちゃんと型がomitされて幸せ。


とはいえもう型のomitも表現できるようになってるけど。