为何JS中不同方式初始化数组，includes方法返回结果不同？

在Chrome 114/MacOS环境下，测试以下代码时会出现includes方法返回结果不一致的情况：

new Array(['foo', 'bar']).includes('foo') ? false : true; // => true

['foo', 'bar'].includes('foo') ? false : true; // => false

问题原因 #

这是对new Array()的参数规则误用导致的：

• 当new Array()传入单个数组参数时，会创建一个长度为1的嵌套数组，实际结构是[ ['foo', 'bar'] ]。此时调用includes('foo')，数组内并没有直接存储'foo'这个值，所以返回false，对应三元表达式结果为true。
• 数组字面量['foo', 'bar']则直接创建了包含两个字符串元素的一维数组，includes('foo')能匹配到目标值，返回true，对应三元表达式结果为false。

正确写法 #

要让new Array()和数组字面量的行为一致，需给new Array()传入多个独立参数（每个参数作为数组的元素）：

new Array('foo', 'bar').includes('foo') ? true : false; // => true

['foo', 'bar'].includes('foo') ? true : false; // => true

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