JavaScript加入多个数组混淆?

时间:2016-05-15 16:05:29

标签: javascript html arrays join

根据W3Schools,join()函数定义为

" join()方法将数组的元素连接成一个字符串,并返回该字符串。 元素将由指定的分隔符分隔。默认分隔符为逗号(,)。"

但是,如果我尝试使用join()函数将两个数组连接在一起,它会产生一个我似乎无法理解的输出。任何人都可以解释一下吗? 以下是示例代码:

<body>

<p>Click the button to join the array elements into a string.</p>

<button onclick="myFunction()">Try it</button>

<p id="demo"></p>

<script>
function myFunction() {
    var fruits = ["Banana", "Orange", "Apple", "Mango"];
    var food = ["Chicken","Fish","Lamb","Prawns"];
    var x = document.getElementById("demo");
    x.innerHTML = fruits.join(food);
}
</script>
</body>

JSFiddle https://jsfiddle.net/gf84ee9y/

3 个答案:

答案 0 :(得分:7)

这是因为您正在连接一个数组并传入另一个数组作为分隔符:

concat

输出实际上是预期的,对于你拥有的每个'水果',你把整个食物阵列放在它们之间。

如果要合并两个数组,请使用var newArray = fruits.concat(food);

{{1}}

现在你可以加入newArray,每个数组只有一个元素的副本。

Working example with concat

答案 1 :(得分:1)

你想使用concat。请参阅documents on concat

x.innerHTML = fruits.concat(food);

答案 2 :(得分:1)