HTMLCollection不是真正的数组，无法直接使用map等方法；Array.from可将其转为数组，因其符合类数组定义（有length和索引），且支持映射函数，语义清晰、简洁高效。
HTMLCollection 是 DOM 中常见的类数组对象，比如 document.getElementsByTagName 或 document.getElementsByClassName 返回的结果。它**不是真正的 Array**，所以不能直接使用 map、filter、forEach 等数组方法。而 Array.from 是最简洁、语义清晰的转换方式之一。
为什么 Array.from 能转 HTMLCollection
Array.from 接收一个可迭代（iterable）或类数组（array-like）对象，并将其转换为新数组。HTMLCollection 虽不可迭代（不支持 for...of），但它具备 length 属性和数字索引（如 item(0) 或 [0]），因此符合“类数组”定义，能被 Array.from 正确识别并展开。
基本用法：一行转数组
直接传入 HTMLCollection 即可：
const divs = Array.from(document.getElementsByTagName('div'));divs.map(div => div.textContent); // ✅ 可以用了
进阶技巧：过滤 + 映射一步到位
Array.from 支持第二个参数——一个映射函数（类似 Array.prototype.map），可在转换同时处理每个元素：
Java Maven 项目审查工作流的通用输入处理。当 Java Maven 项目以 ZIP压缩包或 GitLab 仓库 URL 形式提供且需要...时使用。
立即学习“Java免费学习笔记（深入）”；
- 只取有
data-id的元素文本： - 跳过空节点或无效元素（配合条件判断）：
const texts = Array.from( document.querySelectorAll('[data-id]'), el => el.textContent.trim());
const validInputs = Array.from( document.querySelectorAll('input'), el => el.type !== 'hidden' && el).filter(Boolean);
注意兼容性与替代方案
Array.from 在现代浏览器中广泛支持（IE 不支持）。若需兼容 IE，可用以下任一方式代替：
-
[].slice.call(htmlCollection)（传统写法，较老但兼容性好） Array.prototype.slice.call(htmlCollection)- 扩展运算符：
[...htmlCollection]（更现代，同样不支持 IE）
三者效果一致，但 Array.from 更具可读性，且天然支持映射函数，推荐优先使用。
