如何用ES6函数式写法实现分页页码数组（无第三方库）

我来帮你搞定这个分页页码生成的需求，完全不用第三方库，纯函数式风格来写。先直接上代码，然后一步步拆解逻辑：

const generatePageNumbers = (currentPage, lastPage) => {
  // 确定要展示的页码总数，最多11个，同时不能超过总页数
  const totalPagesToShow = Math.min(11, lastPage);
  
  // 计算起始页码：如果当前页大于5，就以当前页为中心往前推5个；否则从1开始
  let startPage = currentPage > 5 
    ? Math.max(1, currentPage - 5) 
    : 1;
  
  // 计算结束页码：基于起始页码加上要展示的数量减1，同时不能超过最后一页
  let endPage = startPage + totalPagesToShow - 1;
  
  // 如果结束页码超过了最后一页，往回调整起始和结束页码
  if (endPage > lastPage) {
    endPage = lastPage;
    startPage = Math.max(1, endPage - totalPagesToShow + 1);
  }
  
  // 用Array.from生成连续页码数组，替代for循环的函数式写法
  return Array.from({ length: endPage - startPage + 1 }, (_, index) => startPage + index);
};

// 测试示例
console.log(generatePageNumbers(14, 40)); // 输出 [9,10,11,12,13,14,15,16,17,18,19]
console.log(generatePageNumbers(3, 20)); // 输出 [1,2,3,4,5,6,7,8,9,10,11]
console.log(generatePageNumbers(38, 40)); // 输出 [30,31,32,33,34,35,36,37,38,39,40]

逻辑拆解： #

• 控制展示数量：先取11和总页数的最小值，避免总页数不足11时生成无效页码。
• 定位起始页码：当当前页大于5时，要让当前页处于数组中间，所以起始页设为currentPage - 5；如果这个值小于1，就从1开始。如果当前页≤5，直接从1起步。
• 修正边界问题：先按起始页加10（11个页码的间隔）算出结束页，如果超过最后一页，就把结束页锁定为最后一页，再反推起始页，保证展示的页码数量符合要求。
• 生成数组：用Array.from创建连续数组，这是ES6里典型的函数式写法，通过索引计算每个位置的页码，完全替代了传统for循环。

函数式特性说明： #

整个函数是纯函数——相同输入一定会得到相同输出，没有外部副作用；除了临时调整边界的变量外，全程优先使用不可变逻辑，符合函数式编程的核心风格。

内容的提问来源于stack exchange，提问作者Francois Carstens