在Angular TypeScript中如何用map生成从指定数值起始的序列数组

原代码问题分析 #

• 数组长度计算错误：Array(finalPageValue) 创建的数组长度固定为结束值，当初始值不为1时，数组长度不符合「从起始值到结束值的元素总数」要求，正确长度应为 finalPageValue - initialPageValue + 1
• map回调参数的默认值不生效：map方法的回调函数第二个参数固定为当前元素的索引（从0开始计数），你给i设置的i = initialPageValue默认赋值不会生效，实际运行时i还是会取原生的索引值

正确实现方式 #

方案1：基于原有写法修改 #

// 先计算元素总个数
const arrLength = finalPageValue - initialPageValue + 1;
const pageArray = Array(arrLength).fill(1).map((_, i) => initialPageValue + i);

方案2：更简洁的Array.from实现 #

不用提前填充数组，性能更优：

const pageArray = Array.from(
  { length: finalPageValue - initialPageValue + 1 },
  (_, i) => initialPageValue + i
);

示例验证 #

假设initialPageValue = 3，finalPageValue = 7，两种方案都会返回 [3,4,5,6,7]，符合需求。

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