代码之家 › 专栏 › 技术社区 › krishna amarghade

JS生成具有给定数量和幻灯片计数的数组子集

carousel slider frontend reactjs javascript

krishna amarghade · 技术社区 · 2 年前

我正在reactJS中创建自定义滑块,我正在为其创建一个函数以生成预期输出,该函数需要 幻灯片项目 (持有数组列表), 滑块计数 (变量名“spliceCount”)及其应包含的项目数滑动 (变量名称“slideBy”)。

假设我有一个函数,它具有如下三个属性 阵列、拼接计数和滑动 并根据拼接计数和slideby返回数组的子集。到目前为止,使用下面的函数,我能够生成如下代码段所示的输出。

const list = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K'];
const spliceCount = 3;
const slideBy = 2;
function getSusetofArray(array, splice, slide) {
  const arrayList = [...array];
  const subsetList = [];
   while(arrayList.length > 0) {
    subsetList.push(arrayList.splice(0, splice));
  }
  return subsetList;
}
console.log(getSusetofArray(list, spliceCount, slideBy));
// current output with above function
[['A', 'B', 'C'], ['D', 'E', 'F'], ['G', 'H', 'I'], ['J', 'K']]

然而,在spliceCount和slideBy的帮助下,预期结果需要如下所示

expected output = [['A', 'B', 'C'], ['C', 'D', 'E'], ['E', 'F', 'G'], ['G', 'H', 'I'], ['I', 'J', 'K'], ['K']]

1 回复 | 直到 2 年前

Nina Scholz 2 年前

您可以使用所需的增量进行迭代 offset 并通过对阵列进行切片 size 长

function getSubsetOfArray(array, size, offset) {
    const
        result = [];
        
    for (let i = 0; i < array.length; i += offset) {
        result.push(array.slice(i, i + size));
    }

    return result;
}

console.log(getSubsetOfArray(['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K'], 3, 2));

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

推荐文章

krishna amarghade · JS生成具有给定数量和幻灯片计数的数组子集

2 年前

DEGUIDER · Flutter:当我尝试热重新加载以运行应用程序时,我在使用旋转木马滑块时遇到了这个错误“错误:无法解析包的旋转木马滑块”

2 年前

marg · 为什么当我选择下一张或上一张照片时,照片转盘中的当前照片会消失?[下一步/反应]

2 年前

etranz · 如何使图像淡入淡出,而不仅仅在javascript旋转木马中出现一次?

2 年前

ankur ojha · 面向警告动画:未指定“useNativeDriver”。这是必需的选项,必须在react native中显式设置为“true”或“false”

2 年前

bedrock · 如何解决转盘控制位置问题?

2 年前

Marion · 有没有办法通过自动播放来定制另一个react灯箱转盘?

2 年前

Aleks Uher · 引导转盘启动/停止功能

2 年前

BautistaDiSanto · React原生香草旋转木马动画

2 年前

QuietWorld · Glider.js容器与图像宽度相同

2 年前