JavaScript 里的“数组陷阱”：为何你应该多用 Array.of？

在日常开发中，你可能遇到过这样的尴尬场面：明明想创建一个包含三个数字元素的数组，结果 new Array(3) 却变出了一个长度长度为 3、但全是空槽位的“幽灵数组”。这种反直觉的行为，曾让不少前端同学在调试时浪费了不少时间。今天我们要聊的，就是一个能规避这种风险的小能手——Array.of。

很多初学者习惯直接用构造函数生成数组，但 JavaScript 的设计里留了一个特殊的后门。当参数只有一个且为数字时，new Array(n) 会被解释为指定长度，而非填入该数字。这意味着 new Array(3) 得到的不是 [3]，而是 empty × 3 的空洞数组。这种空洞会导致后续的遍历方法（如 map、filter）直接跳过这些位置，引发逻辑漏洞。

这时候，Array.of 就派上用场了。它的核心设计理念非常纯粹：把所有传入的参数原封不动地变成数组元素。无论是一个数字还是多个字符串，它都一视同仁。尝试运行 Array.of(3)，你会得到实实在在的元素 [3]；而 Array.of(1, 2, 3) 则稳定返回 [1, 2, 3]。这种一致性极大地降低了心智负担，再也不用担心传参数量不同导致的行为分裂。

除了基础创建，Array.of 在处理数值配置表时尤为有用。想象一下你需要生成一个固定的配置项列表，比如 ['active', 'pending', 'done']。虽然字面量写法最直观，但在某些动态场景下（比如根据函数返回值组合数组），使用 Array.of 能保证结构绝对紧凑，不会出现意外的空位。

当然，提到 ES6 新特性，大家自然会联想到 Array.from。这两个方法经常被混淆，但它们适用的场景截然不同。Array.from 擅长将类数组对象或可迭代对象转换成新数组，比如把 arguments 对象转成真正的数组，或者通过映射函数处理数据源。而 Array.of 更像是一个“容器包装器”，专门解决参数歧义问题。简单来说，当你需要把确定的值塞进数组，选 of；当你需要对已有数据进行转换，选 from。

还有一个容易被忽视的优势在于对旧方法的兼容性修正。在早期代码中，为了凑齐固定长度的数组，开发者常使用 new Array(n).fill(val) 的方式。虽然 fill 填充后解决了遍历跳过的问题，但结合 Array.of 可以更清晰地表达意图。特别是在配合展开运算符使用时，[...Array.of(item1, item2)] 比混合构造函数更不容易出错。

浏览器对 Array.of 的支持已经非常完善，现代环境基本都能直接使用。不过在实际项目中，不必为了用它而用它。对于简单的两个元素拼接，字面量 [a, b] 依然是最优解。但当你的函数接收不确定数量的参数，且希望统一处理为数组时，它就是最佳替代品。

写代码本质上是在与机器对话，清晰度永远优于炫技。掌握 Array.of 不仅仅是多学一个 API，更是为了解决那些隐蔽的边界情况。下次当你准备调用 new Array(1) 时，不妨停下来想一想：我到底是要长度为 1 的空桶，还是要装着数字 1 的箱子？答案往往就在 Array.of 之中。