如何利用Symbol.isConcatSpreadable控制数组合并时的扁平化行为

Symbol.isConcatSpreadable 属性可控制对象在 concat() 中是否展开：设为 true 时类数组对象被扁平化，false 时数组整体作为单个元素；原生数组默认 true，普通对象默认 false，该属性仅影响 concat()。

你可以直接设置对象的 Symbol.isConcatSpreadable 属性为 true 或 false，来决定它在 concat() 中是否被展开成元素。这不是魔法，而是 JavaScript 明确赋予开发者的行为控制权。

让类数组对象像数组一样展开

DOM 集合、arguments 或自定义类数组对象，默认不会被 concat() 展开，哪怕它们有 length 和数字索引。

• 手动启用展开：给对象设置 [Symbol.isConcatSpreadable] = true
• 例如：const divs = document.querySelectorAll('div'); divs[Symbol.isConcatSpreadable] = true;
• 之后就能直接写 [1, 2].concat(divs)，得到扁平结果，无需先用 Array.from() 转换

阻止数组被自动展开

有时你希望把整个数组当作一个“值”拼进去，而不是拆开它的元素——比如构建嵌套结构或保留数据层级。

• 设置 arr[Symbol.isConcatSpreadable] = false
• 这样 [4, 5].concat(arr) 就不会变成 [4, 5, 1, 2, 3]，而是 [4, 5, [1, 2, 3]]
• 该设置只影响 concat()，不影响其他方法（如 push、spread）

理解默认行为，避免意外

不同对象在 concat() 中的表现差异，根源就在这个符号的默认值：

• 原生数组：默认 Symbol.isConcatSpreadable === true，所以总是展开
• 普通对象（包括类数组）：默认 undefined，等价于 false，因此整体作为一项加入
• 你无法覆盖内置数组的默认行为，但可以显式设为 false 来临时禁用展开

注意兼容性与使用边界

这个特性自 ES6 起就已标准化，现代浏览器和 Node.js 环境均支持，但需留意：

• 不能用于 spread 语法（[...arr]），它走的是迭代协议，不是 concat 逻辑
• 设置该属性不会改变对象本身类型，也不会影响 Array.isArray() 判断
• 若对象同时满足 Array.isArray(obj) === true 且 obj[Symbol.isConcatSpreadable] === false，后者优先生效