【Javascript】オブジェクトの特定の条件を満たす値のキーを配列に変換

どーも!

たかぽんです!

先日ある回収をしていて、結構オブジェクトの扱いで困ったことがあったので忘備録として残しておこうと思います。

やりたかったこと

さて、ちょっと言葉だけでは説明しづらいんですが、今回やりたかったことはオブジェクトのプロパティの中で、値として"true"を持っているもののプロパティ名だけを配列としてまとめたかったんです。

イメージは以下のような感じです。

// これから
var originalObject = {
  member1: true,
  member2: false,
  member3: true
};

// これに
var resultArray = [
  'member1','member2'
];

ある特定の条件(今回はvalueがtrue)を満たしたオブジェクトのキーの配列を抽出する感じです。

配列であればfilterとかが使用できるんですが、オブジェクトではそんな便利なものはなさそうでした...

重要がどれほどあるかは正直わかんないですが、意外と使いそうな気がしますね...

では、実際にやってみたものをみていきます。

やったこと

実際に前述した操作を実現するために、オブジェクトのキーとバリューを取得できるObject.entriesメソッドを使用しました。

forの中でkey, valueという変数を定義し、それに対してオブジェクトの中身を一つづつ渡して処理しています。

forの中では単純にvalue(オブジェクトのバリュー)をみて、true結果出力用配列に対してそのキーをpushしています。

// テスト用データ
const object1 = {
  a: true,
  b: false,
  c: true
};

const result = [];
for (let [key, value] of Object.entries(object1)) {
  if(value) {
    result.push(key);
  }
}

// ["a", "c"]
console.log(result);

ここでたとえばvalueが特定の値(trueやfalseだけでなく文字列等でも)であれば比較できそうです。

他にも多少値を改変した上で(文字列を追加したり削除したり)新しい配列をまとめることもできそうですね。

まとめ

あらためてみるとめっちゃ簡単ですね...!

実はこれ見つけ出すまでに半日位かかりました...w

そもそもオブジェクトを配列に変換する場合、大抵はkeysかvaluesメソッドを使ってそのままオブジェクトのキーの配列orバリューの配列に変換することばかり見つかるんですね...

じゃぁ、そこからさらに特定の条件を適応させたい(valueがtrueだけとか)場合にforeachやfilterを使ってもうまくいかず...

ようやくたどり着いたentriesでやっとできたと言う感じでした。

ちなみにreduceメソッドでも似たような挙動は実装できましたが、ちょっと確認していた限りだと結果格納用の配列と、accumulaterも定義してあげないといけなかったんですよね...

そっちはガッツリやっていないので、もうちょっとやり方工夫すればできそうな気もしますが...

また暇があればMDNのメソッド周りも確認しなおしたいですね...!

それでわ!

おすすめの記事