时间戳

首页 > 解决方案 > 使用 Ramda 的嵌套列表过滤和条件对象映射

javascript - 使用 Ramda 的嵌套列表过滤和条件对象映射

问题描述

我正试图围绕 Ramda.js，但我被困住了。我有一个看起来像这样的数组：

const state = [
  {
    itemId: 112,
    animations: [{id: 1}, {id:2}],
    classes: ['animated']    
  },
  {
    itemId: 121,
    animations: [{id:2}],
    classes: ['animated']    
  }
]

我的目标是创建一个函数

removeAnimation(121, 2, state);

...将返回：

const state = [
  {
    itemId: 112,
    animations: [{id: 1}, {id:2}],
    classes: ['animated']    
  },
  {
    itemId: 121,
    animations: [],
    classes: []    
  }
]

因此，该函数根据指定id的对象内部的指定删除动画 obj itemId，如果数组中没有更多对象animations，它也会删除列表中的animated字符串classes。

这是我走了多远：

const removeAnimationFromItem = R.curry((itemId, animId, state) => {
  return R.map(
    R.when(
      R.propEq('itemId', itemId), [--This is where I'm stuck--]
    ), state)
  })

感谢您的时间。

标签： javascriptarraysramda.js

解决方案

我认为这里有一个重要的问题，即你是否真的想要 Ramda 的行为。如果我们用 Ramda 做这样的事情，它不会改变你的数据。它将返回与您的原件共享它们可以与您的原件共享的新对象，但您的原件仍将保持原样。Ramda 团队（免责声明：我是 Ramda 的作者之一）认为这是一件非常好的事情。但有时可能会令人惊讶。

Ramda 没有任何现成的解决方案可以使这变得容易。如果我要这样做，我可能首先将其分解为两个步骤：删除目标动画，然后更新所有项目的 classes 属性。我觉得这更容易思考。如果结果证明存在性能问题，我可能会考虑将它们结合起来。

这是一种方法：

const {findIndex, propEq, adjust, evolve, remove, without, pipe, map} = R

const removeOneAnimation = (itemId, animId, state) => {
  const itemIdx = findIndex(propEq('itemId', itemId), state)
  if (itemIdx < 0) {return state}
  const animIdx = findIndex(propEq('id', animId), state[itemIdx].animations)
  if (animIdx < 0) {return state}
  return adjust(evolve({animations: remove(animIdx, 1)}) , itemIdx, state)
}

const updateAnimClass = (item) => item.animations.length === 0 ? evolve({classes: without(['animated'])}, item) : item

const removeAnimations = pipe(
  removeOneAnimation,
  map(updateAnimClass)
)

const state = [{"animations": [{"id": 1}, {"id": 2}], "classes": ["animated"], "itemId": 112}, {"animations": [{"id": 2}], "classes": ["animated"], "itemId": 121}]

const newState = removeAnimations(121, 2, state)

console.log(newState)
<script src="//cdnjs.cloudflare.com/ajax/libs/ramda/0.25.0/ramda.js"></script>

请注意，这里的一些 Ramda 代码并没有提供很大的提升。例如，这个：

  const itemIndex = findIndex(propEq('itemId', itemId), state)

可以很容易地写成

  const itemIndex = state.findIndex(item => item.itemId === itemId)

但是其他一些功能，例如evolve, adjust, remove, 和without做很多。如果您想要 Ramda 将数据视为不可变的方法，这些方法相当强大。

推荐阅读