tacamy--blog

JavaScriptを勉強中の人のブログです。

Lodashを使って2つのオブジェクトのDiffを抽出する

JavaScriptで2つのオブジェクトの差分を出したいとき、Lodashの omitBy を使うと簡単に書けた。

const before = {
  a: 1,
  b: 2,
  c: 3
}
const after = {
  a: 0,
  b: 1,
  c: 3
}
const diff = _.omitBy(after, (v, k) => before[k] === v)

この場合、 diff の結果は👇こうなる。

console.log(diff)
// { a: 0, b: 1 }

差分がない場合は空のオブジェクトが返ってくる。

ちなみに、 omitBy の第一引数に渡すオブジェクトのkeyとvalueを基にしてもうひとつのオブジェクトの値と比較してるから、👇こんな感じだとDiffは出ない。 aftera っていうkeyしか持ってないから。

const before = {
  a: 1,
  b: 2
}
const after = {
  a: 1
}
const diff = _.omitBy(after, (v, k) => before[k] === v)
console.log(diff)
// {}

なので、オブジェクトを渡す順番を逆にしたら、どのkeyの値が変わったかというDiffなら取れるけど、

const before = {
  a: 1,
  b: 2
}
const after = {
  a: 1
}
const diff = _.omitBy(before, (v, k) => after[k] === v)
console.log(diff)
// { b: 2 }

基本、keyが同じなオブジェクト同士で、値だけが変わるみたいなときに使おう。