🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
# Array数组的join()方法 # 浅谈JavaScript--Array数组的join()方法 # 浅谈JavaScript--Array数组的join()方法 join()方法的使用: 一、最简单的将数组的每个元素都转为字符串 ``` <pre class="calibre13">``` <span class="token"><</span>script<span class="token">></span> <span class="token2">var</span> num <span class="token">=</span> <span class="token3">Array</span><span class="token1">(</span><span class="token4">"hello"</span><span class="token1">,</span><span class="token4">"world"</span><span class="token1">)</span><span class="token1">;</span> console<span class="token1">.</span><span class="token3">log</span><span class="token1">(</span>num<span class="token1">.</span><span class="token3">join</span><span class="token1">(</span><span class="token1">)</span><span class="token1">)</span><span class="token1">;</span> console<span class="token1">.</span><span class="token3">log</span><span class="token1">(</span>num<span class="token1">.</span><span class="token3">toString</span><span class="token1">(</span><span class="token1">)</span><span class="token1">)</span><span class="token1">;</span> console<span class="token1">.</span><span class="token3">log</span><span class="token1">(</span>num<span class="token1">.</span><span class="token3">join</span><span class="token1">(</span><span class="token4">","</span><span class="token1">)</span><span class="token1">)</span><span class="token1">;</span><span class="token"><</span><span class="token">/</span>script<span class="token">></span> ``` ``` ``` <pre class="calibre13">``` 结果: hello<span class="token1">,</span>world ``` ``` 如果 join()里面不加任何参数,用法与toString()一样 二、将字符组成单词,意为“无缝拼接” ``` <pre class="calibre13">``` <span class="token"><</span>script<span class="token">></span> <span class="token2">var</span> num <span class="token">=</span> <span class="token3">Array</span><span class="token1">(</span><span class="token4">"h"</span><span class="token1">,</span><span class="token4">"e"</span><span class="token1">,</span><span class="token4">"l"</span><span class="token1">,</span><span class="token4">"l"</span><span class="token1">,</span><span class="token4">"o"</span><span class="token1">)</span><span class="token1">;</span> console<span class="token1">.</span><span class="token3">log</span><span class="token1">(</span>num<span class="token1">.</span><span class="token3">join</span><span class="token1">(</span><span class="token4">""</span><span class="token1">)</span><span class="token1">)</span><span class="token1">;</span><span class="token"><</span><span class="token">/</span>script<span class="token">></span> ``` ``` 结果: hello ``` <pre class="calibre13">``` 在 <span class="token3">join</span><span class="token1">(</span><span class="token1">)</span>里面添加<span class="token4">""</span><span class="token3">,变成join</span><span class="token1">(</span><span class="token4">""</span><span class="token1">)</span><span class="token1">,</span>可以将字符无缝添加成一个完整的单词 三、将单词组成句子 ``` ``` ``` <pre class="calibre13">``` <span class="token"><</span>script<span class="token">></span> <span class="token2">var</span> num <span class="token">=</span> <span class="token3">Array</span><span class="token1">(</span><span class="token4">"I"</span><span class="token1">,</span><span class="token4">"Like"</span><span class="token1">,</span><span class="token4">"JavaScript"</span><span class="token1">,</span><span class="token4">"and"</span><span class="token1">,</span><span class="token4">"Array"</span><span class="token1">)</span><span class="token1">;</span> console<span class="token1">.</span><span class="token3">log</span><span class="token1">(</span>num<span class="token1">.</span><span class="token3">join</span><span class="token1">(</span><span class="token4">" "</span><span class="token1">)</span><span class="token1">)</span><span class="token1">;</span><span class="token"><</span><span class="token">/</span>script<span class="token">></span> ``` ``` ``` <pre class="calibre13">``` 结果: <span class="token5">I</span> Like JavaScript and Array ``` ``` ``` <pre class="calibre13">``` 在 <span class="token3">join</span><span class="token1">(</span><span class="token1">)</span>里面添加<span class="token4">" "</span><span class="token3">,变成join</span><span class="token1">(</span><span class="token4">" "</span><span class="token1">)</span>,可以将单词拼接成一段句子 ``` ``` ``` <pre class="calibre13">``` 四、判断数组是不是空字符数组 ``` ``` ``` <pre class="calibre13">``` 注意:这里是判断空字符数组,类似<span class="token1">[</span><span class="token1">,</span><span class="token1">,</span><span class="token1">,</span><span class="token1">,</span><span class="token1">,</span><span class="token1">,</span><span class="token1">,</span><span class="token1">,</span><span class="token1">,</span><span class="token1">]</span><span class="token3">,如果我们使用String</span><span class="token1">(</span>array<span class="token1">[</span><span class="token1">,</span><span class="token1">,</span><span class="token1">,</span><span class="token1">,</span><span class="token1">,</span><span class="token1">]</span><span class="token1">)</span>, ``` ``` ``` <pre class="calibre13">``` 返回的依然是<span class="token1">,</span><span class="token1">,</span><span class="token1">,</span><span class="token1">,</span><span class="token1">,</span><span class="token1">,</span><span class="token1">,</span> ``` ``` ``` <pre class="calibre13">``` <span class="token3">如果使用join</span><span class="token1">(</span><span class="token4">""</span><span class="token1">)</span><span class="token1">,</span>返回的是空白的,可以有效判断这个数组是不是一个空字符数组 ``` ``` ``` <pre class="calibre13">``` 五、将数组转化为页面元素的内容 ``` ``` ``` <pre class="calibre13">``` <span class="token3">这是join</span><span class="token1">(</span><span class="token1">)</span>最为强大的功能 ``` ``` ``` <pre class="calibre13">``` <span class="token"><</span><span class="token">!</span><span class="token5">DOCTYPE</span> html<span class="token">></span><span class="token"><</span>html<span class="token">></span><span class="token"><</span>head lang<span class="token">=</span><span class="token4">"en"</span><span class="token">></span> <span class="token"><</span>meta charset<span class="token">=</span><span class="token4">"UTF-8"</span><span class="token">></span> <span class="token"><</span>title<span class="token">></span><span class="token"><</span><span class="token">/</span>title<span class="token">></span><span class="token"><</span><span class="token">/</span>head<span class="token">></span><span class="token"><</span>body<span class="token">></span><span class="token"><</span>select id<span class="token">=</span><span class="token4">"sel"</span><span class="token">></span><span class="token"><</span><span class="token">/</span>select<span class="token">></span><span class="token"><</span>script<span class="token">></span> <span class="token2">var</span> sel <span class="token">=</span>document<span class="token1">.</span><span class="token3">getElementById</span><span class="token1">(</span><span class="token4">"sel"</span><span class="token1">)</span><span class="token1">;</span> <span class="token2">var</span> array<span class="token">=</span><span class="token1">[</span><span class="token4">"北京市"</span><span class="token1">,</span><span class="token4">"上海市"</span><span class="token1">,</span><span class="token4">"广州市"</span><span class="token1">,</span><span class="token4">"深圳市"</span><span class="token1">]</span><span class="token1">;</span> <span class="token2">var</span> html<span class="token">=</span><span class="token4">"<option>"</span> <span class="token">+</span> array<span class="token1">.</span><span class="token3">join</span><span class="token1">(</span><span class="token4">"</option><option>"</span><span class="token1">)</span><span class="token">+</span> <span class="token4">"</option>"</span><span class="token1">;</span> sel<span class="token1">.</span>innerHTML<span class="token">=</span>html<span class="token1">;</span><span class="token"><</span><span class="token">/</span>script<span class="token">></span><span class="token"><</span><span class="token">/</span>body<span class="token">></span><span class="token"><</span><span class="token">/</span>html<span class="token">></span> ``` ``` 1. 执行结果: ``` <pre class="calibre13">``` <span class="token3">其实join</span><span class="token1">(</span><span class="token1">)</span>里面填入<span class="token4">"</option><option>"</span>的意思就是为数组每个元素前后都添加上 ``` ``` ``` <pre class="calibre14">``` <span class="token"><</span><span class="token">/</span>option<span class="token">></span>北京市<span class="token"><</span>option<span class="token">></span><span class="token"><</span><span class="token">/</span>option<span class="token">></span>上海市<span class="token"><</span>option<span class="token">></span><span class="token1">.</span><span class="token1">.</span> ``` ```