lodashを使用して配列からオブジェクトを検索して返す方法は?


148

私のオブジェクト:

[
    {
        description: 'object1', id: 1
    },
    {
        description: 'object2', id: 2
    }
    {
        description: 'object3', id: 3
    }
    {
        description: 'object4', id: 4
    }
]

以下の私の関数では、一致するIDを見つけるために説明を渡します。

function pluckSavedView(action, view) {
    console.log('action: ', action);
    console.log('pluckSavedView: ', view);  // view = 'object1'

    var savedViews = retrieveSavedViews();
    console.log('savedViews: ', savedViews);

    if (action === 'delete') {
        var delete_id = _.result(_.find(savedViews, function(description) {
            return description === view;
        }), 'id');

        console.log('delete_id: ', delete_id); // should be '1', but is undefined
    }
}

lodashのfindメソッドを使用しようとしています:https ://lodash.com/docs#find

しかし、私の変数delete_idは未定義のまま出てきます。


Ramdaはこの質問をチェックする人のために更新されました。Ramdaはlodashが行うのと同じことを行うための素晴らしいライブラリですが、より機能的なプログラミングの方法で:) http://ramdajs.com/0.21.0/docs/


1
_.findプロパティの1つだけを魔法のようにコールバックに渡すと思われる理由は不明です。console.log(description)コールバック内の単純なものはあなたにそれを伝えているかもしれません。
Felix Kling 2015年

回答:


176

コールバックに渡される引数は、配列の要素の1つです。配列の要素は、フォームのオブジェクトです{description: ..., id: ...}

var delete_id = _.result(_.find(savedViews, function(obj) {
    return obj.description === view;
}), 'id');

あなたがリンクしたドキュメントからのさらに別の代替手段(lodash v3):

_.find(savedViews, 'description', view);

Lodash v4:

_.find(savedViews, ['description', view]);

4
ありがとう!これも機能することがわかりましたvar delete_id = _.result(_.find(savedViews, { 'description': view }), 'id');。さらに10分...
Leon Gaban

2番目のソリューションは間違っています。matchesProperty省略表現を使用するには、述語が配列である必要があります。それは_.find(savedViews, ['description', view])
franksands

1
@FranciscoGuimaraes:まあ、2015年に戻って、lodashはこのように機能しました:lodash.com/docs/3.10.1#find
Felix Kling

1
@FelixKling私はそれがこのようなものであるかもしれないと思ったが、2018年に回答を探している人々(私のような)にコメントを追加することをお勧めします。回答の更新をありがとう
franksands


29

バニラJSでこれを簡単に行うことができます:

使用する find

const savedViews = [{"description":"object1","id":1},{"description":"object2","id":2},{"description":"object3","id":3},{"description":"object4","id":4}];

const view = 'object2';

const delete_id = savedViews.find(obj => {
  return obj.description === view;
}).id;

console.log(delete_id);

使用filter(元の回答)

const savedViews = [{"description":"object1","id":1},{"description":"object2","id":2},{"description":"object3","id":3},{"description":"object4","id":4}];

const view = 'object2';

const delete_id = savedViews.filter(function (el) {
  return el.description === view;
})[0].id;

console.log(delete_id);


6
確かに、しかしlodashはとてもすっきりしているように見えます。[0]これを使用する必要はありません。var delete_id = _.result(_.find(savedViews, { 'description': view }), 'id');デモに感謝します+1
Leon Gaban

空の結果を[0]に強制すると失敗しませんか?したがって、Lodashがデフォルトで処理する@LeonGabanへの+1。
kiradotee 2018年

3
@LeonGabanは、ES6を使用せずにlodashなしでクリーナーを使用できます savedViews.find(el => el.description === view)
Ram Babu S

素晴らしい答え!!
Ole

11

このfindメソッドを使用すると、次のように、コールバックに各要素の値が渡されます。

{
    description: 'object1', id: 1
}

したがって、次のようなコードが必要です。

_.find(savedViews, function(o) {
        return o.description === view;
})

8

これのために、配列内の指定されたオブジェクトを検索します。_。findの基本的な使用例

const array = 
[
{
    description: 'object1', id: 1
},
{
    description: 'object2', id: 2
},
{
    description: 'object3', id: 3
},
{
    description: 'object4', id: 4
}
];

これはうまくいくでしょう

q = _.find(array, {id:'4'}); // delete id

console.log(q); // {description: 'object4', id: 4}

_.findは、インデックスではなく配列の要素を返すのに役立ちます。したがって、オブジェクトの配列があり、特定のキー値によって配列内の単一のオブジェクトを検索する場合、pare _.findがジョブに適したツールです。


7

LodashやRamdaなどの追加の依存関係は必要ありません。

ES6のfind()関数を機能的に使用するだけです。

savedViews.find(el => el.description === view)

サードパーティのライブラリを使用して、付属のすべての便利な機能を入手する必要がある場合があります。ただし、一般的に言えば、必要のない依存関係は避けてください。依存関係は次のことができます。

  • バンドルされたコードサイズを膨らませ、
  • あなたはそれらを最新に保つ必要があります、
  • バグやセキュリティリスクが発生する可能性があります

正解です!! まさに私が探していたもの。
Ole


6

以下を使用できます

import { find } from 'lodash'

次に、次のようにリストからオブジェクト全体(キーや値だけでなく)を返します。

let match = find(savedViews, { 'ID': 'id to match'});

4

lodash使用してインポート

$ npm i --save lodash

var _ = require('lodash'); 

var objArrayList = 
    [
         { name: "user1"},
         { name: "user2"}, 
         { name: "user2"}
    ];

var Obj = _.find(objArrayList, { name: "user2" });

// Obj ==> { name: "user2"}

詳細を追加
キングストーン

1

名前に基づいてIDを取得する

 {
    "roles": [
     {
      "id": 1,
      "name": "admin",
     },
     {
      "id": 3,
      "name": "manager",
     }
    ]
    }



    fetchIdBasingOnRole() {
          const self = this;
          if (this.employee.roles) {
            var roleid = _.result(
              _.find(this.getRoles, function(obj) {
                return obj.name === self.employee.roles;
              }),
              "id"
            );
          }
          return roleid;
        },
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.