findWhere関数をfindを使って作る

Question

find関数を使って、findWhere関数を作っています。
以下が模範回答です。

var ladders = [
  { id: 1, height: 20 },
  { id: 3, height: 25}
]

function findWhere(array, criteria) {
  return array.find(element => {
    var property = Object.keys(criteria)[0];
    return element[property] === criteria[property]
  })
}

findWhere(ladders, { height: 25 })
// result: { id: 3, height 25 }

以下のようにObject.keys(criteria);と書いても変わらないと思うのですがObject.keys(criteria)[0];と書く必要があるのでしょうか？

var ladders = [
  { id: 1, height: 20 },
  { id: 3, height: 25}
]

function findWhere(array, criteria) { 
  return array.find(element => {
      var property = Object.keys(criteria);
      return element[property] === criteria[property];
  });
}

findWhere(ladders, { height: 25 })
// result: { id: 3, height 25 }

Comments

[jun68ykt]

引数として与えるarray および criteria が、具体例にどのような配列およびオブジェクトなのかが分かる具体例と、その場合のfindWhereの返す値の期待値をご質問に追記されると、より有用な回答が得られると思われます。

[退会済みユーザー]

追記いたしました！

[jun68ykt]

回答しました。参考になれば幸いです。

Answer 1

こんにちは

確かに、minaraiengineerさんのおっしゃるように[0] の無い

var property = Object.keys(criteria);

であっても、array.find の前に return を追加して

function findWhere(array, criteria) { 
  return array.find(element => {
      var property = Object.keys(criteria);
      return element[property] === criteria[property];
  });
}

としておけば、criteria が { height: 25 } という、キーと値の組が１個のオブジェクトである限りは、findする関数として動作します。以下にて確認できます。

• 動作確認用CodePen： https://codepen.io/jun68ykt/pen/xxGoXNr?editors=0012

これは、変数property に入ってくる配列 ["height"] が、オブジェクトのキーとして使われると heightプロパティにアクセスしてくれるからで、["height"] == "height" が true になることにも関係しています。

$ node
Welcome to Node.js v12.7.0.
Type ".help" for more information.
> ["height"] == "height"
true
>

ですが、 criteria オブジェクトにキーが追加されて、Object.keys(criteria)が長さ2以上の配列になってしまうと意図した動作にならなくなってしまうので、 ["height"] == "height" であることを意図的に使ったコードというのはあまりにもトリッキーで、いつまでも残しておくのはあまりよろしくないのでは、と思ったりもします。

とはいえ、そういったコードの保守という観点はさておき、ご質問にある、「[0]無しで動くか、動かないか」という観点だけでいえば、確かに[0]無しでも動きますね。

以上参考になれば幸いです。

Comments

[退会済みユーザー]

[0]がついててもついてなくても今回の場合は特に違いがないという認識で合ってますでしょうか？
保守という観点ではこの関数自体が微妙なんですかね、、、

[jun68ykt]

criteria　が現状の { height: 25 }　のように、 "height" しかプロパティを持たないのであれば、

var property = Object.keys(criteria);

という、 [0] なしでも運良く（？）動きます。

ですが、もしladdersの要素のオブジェクトに、height のほかに例えば、width が追加されて、それに合わせて、 criteria も { height: 25, width: 10 } のように、height　と widthを指定できるようにして、heightとwidthの両方または少なくとも一方が一致するものをfindしたい、といったような仕様に拡張していくことが見えているのであれば、["height"] == "height" がtrueであることに頼った、

var property = Object.keys(criteria);

は今から避けて、Object.keys(criteria) が返すのは配列であるということが明確に分かるコードにするべきかなと思います。そういう意味では、現状においても [0] を付加した

var property = Object.keys(criteria)[0];

のほうが好ましいですね。["height"] == "height" だから運良く動いているコードを業務で使うのは、ちょっと危うい気がします。

[退会済みユーザー]

読み返して、やっと意味を理解しました！
何度も回答して頂きありがとうございます。勉強になりました！

[jun68ykt]

どういたしまして。疑問が解消されたようで、よかったです????