如何在JavaScript中将数组传入隐藏输入框并直接取回数组？

问题核心是直接给input的value赋值数组时，数组会被自动转为逗号分隔的字符串。要直接取回数组，需要用JSON序列化/反序列化的方式：

1. 存储数组到hidden input #

把数组转为JSON字符串后再赋值给input的value：

<input type="hidden" name="LabelProduitInput" value=${JSON.stringify(labelProduitsArray)}>

JSON.stringify()会把数组转换成标准的JSON格式字符串，比如["BlaBla","BloBlo"]会被转成"[\"BlaBla\",\"BloBlo\"]"，完整保留数组结构。

2. 取回并还原数组 #

拿到hidden的字符串值后，用JSON.parse()解析回数组：

const labelStr = product.fields.LabelProduitInput;
const labelProduitsArray = JSON.parse(labelStr);
console.log(labelProduitsArray); // 输出 ["BlaBla","BloBlo"]

为什么原来的方法不行？ #

当直接把数组赋值给input的value时，JavaScript会自动调用数组的toString()方法，将数组转为逗号分隔的字符串（比如["BlaBla","BloBlo"]变成"BlaBla,BloBlo"），所以取回时只能得到合并后的字符串。而JSON序列化的方式能完整保留数组的结构，还能正确处理包含特殊字符的数组元素，比手动拆分字符串更可靠。

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