web-dev-qa-db-ja.com

Immutable.jsのマップ内のリストから要素を削除するための最良の方法

FacebookのImmutable.js を使用してReactアプリケーションを高速化して PureRenderミックスイン を利用しています。私のデータ構造の1つはMap()とそのマップのキーの1つに値としてList<Map>()があります。私が疑問に思っているのは、List()、それを削除するための最良の方法は何ですか?これまでのところ、私は以下を考え出しました。これは最良の(最も効率的な)方法ですか?

// this.graphs is a Map() which contains a List<Map>() under the key "metrics"
onRemoveMetric: function(graphId, metricUUID) {
    var index = this.graphs.getIn([graphId, "metrics"]).findIndex(function(metric) {
        return metric.get("uuid") === metricUUID;
    });
    this.graphs = this.graphs.deleteIn([graphdId, "metrics", index]);
}

(リスト内の各要素にはUUIDがあるため、List<Map>()自体をMap()に移動することを検討しましたが、まだその時点ではありません。)

10
Matthew Herbst

Map.filter

onRemoveMetric: function(graphId, metricUUID) {
  this.graphs = this.graphs.setIn([graphId, "metrics"],
    this.graphs.getIn([graphId, "metrics"]).filter(function(metric) {
      return metric.get("uuid") !== metricUUID;
    })
  )
}

パフォーマンスの観点から、このコード(あなたのような)はリスト内の要素を反復処理する必要があるため、マップへの切り替えはおそらくより効率的です。

16
OlliM

@YakirNaによって提案されているように pdateIn を使用すると、これは次のようになります。

ES6:

  onRemoveMetric(graphId, metricUUID) {
    this.graphs = this.graphs.updateIn([graphId, 'metrics'],
      (metrics) => metrics.filter(
        (metric) => metric.get('uuid') !== metricUUID
      )
    );
  }

ES5:

  onRemoveMetric: function(graphId, metricUUID) {
    this.graphs = this.graphs.updateIn([graphId, "metrics"], function(metrics) {
      return metrics.filter(function(metric) {
        return metric.get("uuid") !== metricUUID;
      });
    });
  }
6
quotesBro