数组是任何语言的强大功能. 它们允许您轻松存储多个信息片段. 它们将保持添加的项目的顺序,甚至可以分类。 在现代的网页浏览器中,它们甚至可以自动魔法地将自己转换成可读的人类字符串。
即使在现代优雅的情况下,仍然可以知道如何将数组转换为字符串,当您需要将数组按摩到另一个格式时,或者想要做更多的事情,而不仅仅是将值分开(默认行为)。
开始的
无需特殊工具. 您可以通过您的 Web 浏览器的控制台或使用 Node.js REPL 进行黑客攻击。
要么是弦,要么不是弦。
如果您在您的浏览器中运行以下操作:
1alert([1, 2, 3]);
如果您只需要在这个格式中显示一个数组的内容,这可以让你走得很远,这甚至在参照模板字母中的数组对象时也是有效的。
在帽子下,数组项目被合并为一个字符串,使用comma , 字符作为界限器。
1[1, 2, 3].toString();
2[1, 2, 3].join();
这两个结果都是相同的1,2,3字符串。
事实上,这就是 .toString() 方法能为我们做的,它不接受任何参数,因此它的实用性是相当有限的。
虽然数组实际上是JavaScript中的对象,但一个数组的 .toString() 方法取代了对象的 .toString() 方法,这就是为什么我们不会最终使用不那么有用的 `[object Object]' 字符串的原因。
一起加入
虽然它的默认行为(没有任何通过的参数)与 .toString() 相同,但 .join() 方法更强大。
假设您在创建字符串时想要在字符串后包含一个空间,您可以说 .join() 是使用的确切字符串:
1[1, 2, 3].join(', ');
更愿意将每个数组项目放在自己的行上吗? 输入一个新的行字符:
1[1, 2, 3].join('\n');
您正在使用HTML,想要使用这些中断?
1[1, 2, 3].join('<br>');
想要HTML打破和新线条?...好吧,你得到的想法。
.join() 方法接受一个可选的参数,允许您定义您想要使用的分离符号或字符来将数组项目合并在一起。
谈到HTML
我最喜欢的 .join() 技巧之一,在模板字母和 JSX 使它非常容易使用多个标记行块之前,就是使用 .join() 将一系列 HTML 标签组合成一个字符串:
1[
2 '<table>',
3 '<thead>',
4 '<tr>',
5 '<th>Name</th>',
6 '<th>Level</th>',
7 '</tr>',
8 '</thead>',
9 '<tbody>',
10 '<tr>',
11 '<td>Alligator</td>',
12 '<td>9001</td>',
13 '</tr>',
14 '</tbody>',
15 '</table>',
16].join('');
将空串转到 .join() 只会连接数组项目,而无需任何额外的字符。
仍然非常方便地处理多个行字符串和 / 或标记,当您没有访问一些更现代的语法选项时。
结论
即使你所要做的只是向用户显示一个单独的数组项目列表,你仍然可以从使用 `.join() 方法中受益。
与不理解被传输的数组的后端服务器一起工作?将数组项目合并为一个值,你可以去!