ロダッシュを使用してリストから要素を削除するにはどうすればよいですか?


165

次のようなオブジェクトがあります。

var obj = {
    "objectiveDetailId": 285,
    "objectiveId": 29,
    "number": 1,
    "text": "x",
    "subTopics": [{
        "subTopicId": 1,
        "number": 1
    }, {
        "subTopicId": 2,
        "number": 32
    }, {
        "subTopicId": 3,
        "number": 22
    }]
}
var stToDelete = 2;

私がしているlodash他のもののために自分のアプリケーションにインストールされています。オブジェクトからlodashエントリを削除するために使用する効率的な方法はありますか?{"subTopicId":2, "number":32}obj

それともこれを行うためのJavaScript方法はありますか?


1
splicedeveloper.mozilla.org/en-US/docs/Web/JavaScript/Reference/…)を使用して、リストからアイテムを削除することができます
z33m

1
配列[1,4,5]から4を削除することはこの方法では実行できないため、タイトルを変更しました。はい、配列はハッシュ/オブジェクトから実装できることを理解していますが、おそらくそうですが、これら2つには微妙な違いがあります。配列から削除するには、result = _.pull(arr, value) これを使用します。これにより、一致するすべての値がリストから削除されます。
ボートコーダー2015

回答:


247

lyyonsがコメントで指摘したように、これを行うためのより慣用的で奇抜な方法は_.remove、次のようにを使用することです

_.remove(obj.subTopics, {
    subTopicId: stToDelete
});

それとは別に、現在の要素を削除する必要があるかどうかを判断するためにその結果が使用される述語関数を渡すことができます。

_.remove(obj.subTopics, function(currentObject) {
    return currentObject.subTopicId === stToDelete;
});

または、次のように古い配列をフィルタリングして新しい_.filterオブジェクトを作成し、同じオブジェクトに割り当てることもできます。

obj.subTopics = _.filter(obj.subTopics, function(currentObject) {
    return currentObject.subTopicId !== stToDelete;
});

または

obj.subTopics = _.filter(obj.subTopics, {subTopicId: stToKeep});

3
この答えが揺るぎないのは、私が探していた述語関数を使用できるためです。インデックスがわかっていれば要素を削除するのは簡単ですが、インデックスがわからない場合はどうでしょうか。
random_user_name 2016年

3
元の配列を変更したくない場合は、_。filterについて言及する価値があるかもしれません...
random_user_name

@cale_bありがとうございます:-)回答を_.filterバージョンで更新しました。
thefourtheye

7
@thefourtheye _.filter は、述語が真の場合に要素を返します。実装は、保持したい要素ではなく、すべての不要な要素を返します
Xeltor

5
同じ述語を使用する_.reject代わりに、@ thefourtheyeを使用する必要があります_.filter。詳細については私の答えを確認しください!
Xeltor 2017年

29

バニラJSを使用してください。を使用spliceして要素を削除できます。

obj.subTopics.splice(1, 1);

デモ


3
ユーザーが尋ねるIs there an efficient way to use _lodash to delete
semirturgay 2014年

7
@Andyあなたは正しいですが、インデックスがまだ知られていない場合はどうなりますか?
thefourtheye

3
splice()は、配列を変更したい場合に最適なアプローチです。removeを使用すると、新しい配列が返されるため、これを再割り当てする必要があります。
omarjebari

配列内のインデックスによって項目を配列から削除する場合(明らかに、この方法で削除アクションを実行する場合は、このインデックスがあります)、スプライスメソッドを使用するのが最も効率的(かつ簡単)な方法です。それをするために。何かを比較したり、コードを複雑にしたり、バグやエラーに対して脆弱にしたりする必要はありません...
TheCuBeMan

26

あなたはそれを行うことができます_pull

_.pull(obj["subTopics"] , {"subTopicId":2, "number":32});

参照を確認してください


7
ドキュメントごとに、_.pull使用して比較のための厳格な平等を、すなわち===。2つの異なるプレーンオブジェクトが等しい===(または==その点では)として比較されることはありません。したがって、上記のコードでは、配列から要素が削除されることはありません。
Mark Amery 2014年

1
それでも、配列内の文字列を処理できるのはそれだけです。_.remove配列をフラッシュするだけです。
Yauheni Prakopchyk

3
私はまだこれが正しい答えだと思います。JS .filterは一致するすべての要素を削除し、JS .spliceはインデックスを知っている必要があります。_。removeは配列のすべての要素を反復するため、効率が低下します。_.pullはまさに私が欲しいものです:_.pull(array、itemToRemove)。
ユダガブリエルヒマンゴ2016

21

_.rejectを使用できるようになりました。これにより、保持する必要があるものではなく、取り除く必要があるものに基づいてフィルタリングできます。

とは異なり_.pull_.removeそれ._rejectは 配列でのみ機能し、Collection

obj.subTopics = _.reject(obj.subTopics, (o) => {
  return o.number >= 32;
});

2

私が知っているようにこれを行うには4つの方法があります

const array = [{id:1,name:'Jim'},{id:2,name:'Parker'}];
const toDelete = 1;

最初:

_.reject(array, {id:toDelete})

2つ目は次のとおりです。

_.remove(array, {id:toDelete})

このようにして、配列は変化します。

3つ目は:

_.differenceBy(array,[{id:toDelete}],'id')
// If you can get remove item 
// _.differenceWith(array,[removeItem])

最後は次のとおりです。

_.filter(array,({id})=>id!==toDelete)

私は学んでいます lodash

後で答えを見つけることができるように、回答を記録しておいてください。


私が探していたreject
サンプガン

2

@thefourtheyeの回答に加えて 、従来の匿名関数の代わりに述語を使用します。

  _.remove(obj.subTopics, (currentObject) => {
        return currentObject.subTopicId === stToDelete;
    });

または

obj.subTopics = _.filter(obj.subTopics, (currentObject) => {
    return currentObject.subTopicId !== stToDelete;
});

1

ロダッシュとタイプスクリプト

const clearSubTopics = _.filter(obj.subTopics, topic => (!_.isEqual(topic.subTopicId, 2)));
console.log(clearSubTopics);

0

以下は、配列を使用したシンプルなlodash関数で、インデックス番号を使用して削除します。

index_tobe_delete = 1

fruit = [{a: "apple"}, {b: "banana"}, {c: "choco"}]
_.filter(fruit, (value, key)=> {
return (key !== index_tobe_delete)
})
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.