使用ramda

Question

我有一系列照片，每张照片都有aspectRatio。我想根据aspectRatio将数组拆分为不同长度的较小数组。

const photos = [
  { fluid: { aspectRatio: 1.5 } },
  { fluid: { aspectRatio: 1.5 } },
  { fluid: { aspectRatio: 0.67 } },
  { fluid: { aspectRatio: 0.67 } },
  { fluid: { aspectRatio: 0.67 } },
  { fluid: { aspectRatio: 0.67 } },
  { fluid: { aspectRatio: 1.5 } },
  { fluid: { aspectRatio: 1.5 } },
  { fluid: { aspectRatio: 0.67 } }
]

在这种情况下，我希望默认情况下将数组每2个项目拆分一次，然后在连续aspectRatio < 1的3个项目中将其拆分为3个项目。

我想留下的是这样：

const result = [
  [
    { fluid: { aspectRatio: 1.5 } }, 
    { fluid: { aspectRatio: 1.5 } }
  ],
  [
    { fluid: { aspectRatio: 0.67 } },
    { fluid: { aspectRatio: 0.67 } },
    { fluid: { aspectRatio: 0.67 } },
  ],
  [
    { fluid: { aspectRatio: 0.67 } }, 
    { fluid: { aspectRatio: 1.5 } }
  ],
  [
    { fluid: { aspectRatio: 1.5 } }, 
    { fluid: { aspectRatio: 0.67 } }
  ],
]

我看过使用splitWhen，但是它似乎只能在当前项目上使用，而不能在数组中前移。

Answer 1

您可以使用Array.reduce()来迭代数组，并根据您提供的规则将新的子数组添加到累加器。始终将当前项目推送到最后一个子数组：

const photos = [{"fluid":{"aspectRatio":1.5}},{"fluid":{"aspectRatio":1.5}}, {"fluid":{"aspectRatio":1.5}},{"fluid":{"aspectRatio":0.67}},{"fluid":{"aspectRatio":0.67}},{"fluid":{"aspectRatio":0.67}},{"fluid":{"aspectRatio":0.67}},{"fluid":{"aspectRatio":1.5}},{"fluid":{"aspectRatio":1.5}},{"fluid":{"aspectRatio":0.67}}]

const allAspectsUnder1 = arr => arr.every(o => o.fluid.aspectRatio < 1)

const result = photos.reduce((r, o) => {
  const last = r[r.length - 1]

  if (!last ||
    last.length === 3 ||
    (last.length === 2 && !allAspectsUnder1(last))
  ) r.push([])

  r[r.length - 1].push(o)

  return r
}, [])

console.log(result)

这是Ramda中的等效概念：

const { pipe, length, equals, allPass, any, pathSatisfies, lt, last, anyPass,  isNil, reduce, ifElse, init } = R

const lengthEquals = len => pipe(length, equals(len))

const length2AndLargeAspects = allPass([
  lengthEquals(2),
  any(pathSatisfies(lt(1), ['fluid', 'aspectRatio'])),
])

const shouldAddSub = pipe(
  last,
  anyPass([
    isNil,
    length2AndLargeAspects,
    lengthEquals(3),
  ])
)

const fn = reduce(ifElse(
  shouldAddSub, 
  (a, o) => [...a, [o]],
  (a, o) => [...init(a), [...last(a), o]],
), [])

const photos = [{"fluid":{"aspectRatio":1.5}},{"fluid":{"aspectRatio":1.5}}, {"fluid":{"aspectRatio":1.5}},{"fluid":{"aspectRatio":0.67}},{"fluid":{"aspectRatio":0.67}},{"fluid":{"aspectRatio":0.67}},{"fluid":{"aspectRatio":0.67}},{"fluid":{"aspectRatio":1.5}},{"fluid":{"aspectRatio":1.5}},{"fluid":{"aspectRatio":0.67}}]

const result = fn(photos)

console.log(result)

<script src="https://cdnjs.cloudflare.com/ajax/libs/ramda/0.26.1/ramda.js"></script>

Answer 2

我认为Ramda在这里没有任何帮助。我的想法是递归执行此操作：

const group = (ps, rs = []) => ps.length == 0
  ? rs
  : ps.length < 3
    ? rs.concat([ps])
    : ps.slice(0, 3).every(p => p.fluid.aspectRatio < 1)
      ? group(ps.slice(3), rs.concat([ps.slice(0, 3)]))
      : group(ps.slice(2), rs.concat([ps.slice(0, 2)]))

const photos = [{fluid: {aspectRatio: 1.5}}, {fluid: {aspectRatio: 1.5}}, {fluid: {aspectRatio: 0.67}}, {fluid: {aspectRatio: 0.67}}, {fluid: {aspectRatio: 0.67}}, {fluid: {aspectRatio: 0.67}}, {fluid: {aspectRatio: 1.5}}, {fluid: {aspectRatio: 1.5}}, {fluid: {aspectRatio: 0.67}}]

console.log(group(photos))

Answer 3

使用简单的do/while循环。将子数组切为3，并检查是否大于1，如果存在则跳回到2

let res=[], sIdx = 0;

do {

 const arr = photos.slice(sIdx, sIdx + 3); 
 if(arr.length > 2 && arr.some(({ fluid:{aspectRatio}}) => aspectRatio >= 1 ) ){
    arr.pop();
 }
 res.push(arr);
 sIdx += arr.length;
 
} while ( sIdx < photos.length)

console.log(res)

.as-console-wrapper {	max-height: 100%!important;}

<script>

const photos = [
  { fluid: { aspectRatio: 1.5 } },
  { fluid: { aspectRatio: 1.5 } },
  { fluid: { aspectRatio: 0.67 } },
  { fluid: { aspectRatio: 0.67 } },
  { fluid: { aspectRatio: 0.67 } },
  { fluid: { aspectRatio: 0.67 } },
  { fluid: { aspectRatio: 1.5 } },
  { fluid: { aspectRatio: 1.5 } },
  { fluid: { aspectRatio: 0.67 } }
]

</script>