jQueryでeachの連続を避ける方法はありますか？

Question

###実現したいこと
以下のvar search_menus = {}というオブジェクトは、ユーザーがラジオボタンで選択する内容でローカルストレージに入っている値です。
ラジオボタンなので一つだけtrueの部分が入る予定です。
それを{ color: "red" }と取得したいです。
###該当のソースコード

var search_menus = {
  "search_page": "comments",
  "search_filter": {
    "posts": {
      "taxi": {
        "aaa": false
      }
    },
    "comments": {
      "color": {
        "red": true // ユーザーが red のラジオボタンを選択している状態
      }
    },
    "users": {
      "airplane": {
        "aaa": false,
        "rrr": false,
        "vvv": false
      },
      "train": {
        "rrr": false,
        "ttt": false
      },
    },
  }
};

###試したこと
大変醜くて恐縮なのですが、自分のスキルでは次のようなeachの連続になってしまいます。
もっと良い書き方がございましたら知りたいと考えているのですが、みなさんならどう書きますでしょうか？

var result = getSelectedFilter(search_menus);
console.log(result); // { color: "red" } が取得できるが、eachの連続がやや醜く感じます

function getSelectedFilter(search_menus){
  let result = {};
  const search_filter = search_menus.search_filter;
  $.each(search_filter, function(search_page,obj1){
    $.each(obj1, function(content_name,obj2){ 
      $.each(obj2, function(kind,state){ 
        if(state === true){
          result[content_name] = kind;
        }
      });
    });
  });	
  return result;
}

Comments

[Lhankor_Mhy]

jQueryは必須ですか？

[kata2murin]

こちら確認遅れてすみません。特に必須とは考えていませんでした。

Answer 1

こんにちは。

再帰を使ってはいかがでしょうか。

function getSelectedFilter(obj){
  let result = {};
  $.each(obj, function( k, v ){
    if( v === true ){
      result[k] = v;
    }
    if( v instanceof Object ){
      Object.assign( result, getSelectedFilter(v) );
    }
  });    
  return result;
}

勘違いをしていたようなので追記

上記のコードは返すものを間違っていましたので訂正します。

jQueryが必須でないのであれば、flatMap()が便利です。
Array.prototype.flatMap() - JavaScript | MDN

function getSelectedFilter(obj, key=undefined){
  return Object.entries(obj).flatMap( ([ k, v ]) => {
    if( v === true ){
      return {[key]: k};
    }
    if( v instanceof Object ){
      return getSelectedFilter(v, k);
    }
    return [];
  });    
}

Comments

[kata2murin]

なるほどこういった処理には再帰が便利ですね。そちら使わせて頂きます。どうもありがとうございました。

[Lhankor_Mhy]

少し問題を勘違いしていたようです。
追記します。

[kata2murin]

追記ありがとうございます。そちらだと配列で返るんですね。Object.entriesもflatMapも知らないメソッドで勉強になりました。

Answer 2

オブジェクトは、丁寧にkeyを.で繋いでいけばとれます。

console.log(search_menus.search_filter.comments)

これだけだと{ color: "red" }という形にはなりませんが、ヒント程度にはなると思います。

Comments

[kata2murin]

すみません。どんなヒントとして活かせるかわかりませんでした。ありがとうございました。

[m.ts10806]

動かしてみれば何が取れるか分かるから、あとは自身で加工すれば良いという話。