Question

我正在尝试了解如何处理数学问题，例如以下摘录，在我正在遵循的教程的分页部分中对此进行了演示。

const renderResults = (arrayOfItems, pageNum = 1, resultsPerPage = 10) => {
  const start = (pageNum - 1) * resultsPerPage;
  const end   = pageNum * resultsPerPage;
  arrayOfItems.splice(start, end).forEach(renderToScreenFunction);
};

在本教程中，只是输入了该解决方案，没有进行解释，这让我开始思考，如果我没有看到该解决方案，那么我将无法以这种方式考虑它。

我了解了问题的目的以及拼接如何将阵列分解成多个部分。但是对我来说，如何在不定长度的数组上使用splice方法获取起始值和终止值并不明显。我应该怎么去考虑解决这个问题？

请理解，我在业余时间学习编程，这对大多数人来说似乎很简单，我一直对数学感到恐惧和挣扎，我发布此问题以希望变得更好。

如果有人能解释理论上如何解决此类问题，我将不胜感激。我应该学习什么数学/程序设计领域，以更好地解决此类问题。任何指针都会有很大的帮助。非常感谢。

Answer 1

好的，所以您开始的是

要显示的东西列表，只要它是原样。
页码，例如第一页是第一页
页面大小（每页项目数）

要知道要显示列表中的哪些元素，您需要考虑页面编号和页面大小说明必须跳过多少个元素。如果您在第1页上，则无需跳过任何元素。如果您在第5页上呢？

好吧，第一页什么也没跳过。第二页将不得不跳过每页元素的数量。第三页将不得不跳过每页两次元素数量，依此类推。我们可以概括一下，对于页面 p ，您需要跳过 p-1 乘以每页元素数的次数。因此，对于第5页，您需要跳过每页元素数量的4倍。

在跳过前几页后显示该页面很容易：只需显示每页下一个元素。

请注意，您发布的代码似乎没有解决两个细节。这些详细信息是：

如果列表的实际长度不能被页面大小均分怎么办？
如果请求的页面远远超出列表的实际长度怎么办？

对于第一个细节，您只需要在确定了要跳多远的时间后进行测试。

Answer 2

您的函数在Splice方法中有错误

  arrayOfItems.splice(start, end).forEach(renderToScreenFunction);

第二个参数必须是要提取的长度，而不是最后一个指数。您无需计算end索引，但可以使用改为resultsPerPage。

我已经重写了代码，没有错误，删除了函数包装以便更好地理解，并添加了一些注释...

// set the initial variables
const arrayOfItems =['a','b','c','d','e','f','g','h','i','j','k','l','m'];
const pageNum = 2;
const resultsPerPage = 5;

// calculate start index
const start = (pageNum - 1) * resultsPerPage; // (2-1)*5=5

// generate a new array with elements from arrayOfItems from index 5 to 10
const itemsToShow = arrayOfItems.splice(start, resultsPerPage) ; 

// done! output the results iterating the resulting array
itemsToShow.forEach( x=> console.log(x) )

代码说明：

设置初始参数
计算数组的start index，与您尝试获取的页面相对应。（(pageNum - 1) * resultsPerPage）
生成一个新数组，从resultsPerPage索引开始，从arrayOfItems中提取start个项目（如果页面不存在，则返回空数组）
迭代生成的数组（itemsToShow）以输出结果。

理解代码的最好方法是有时尝试运行它并观察其行为和结果。

理解javascript分页数学问题

2 个答案: