从位于阵列内的 arrays 中删除逗号

Question

我有以下数组，包含较小的 arrays：

var fruits = [["Bananas", "2"], ["Apples", "4"], ["Oranges", "5"]];

我想像这样显示它们，删除较小的 arrays 内的逗号并添加连字符：

香蕉 - 2

苹果 - 4

橙子 - 5

我尝试了以下方法，但仍然无法正常工作：

 var fruits = [ ["Bananas", "2"], ["Apples", "4"], ["Oranges", "5"] ]; var fruitsToday = []; for (i = 0; i < fruits.length; i++) { fruitsToday += fruits[i].join(" - "); } document.getElementById("today").innerHTML = fruitsToday.join("<br>");

任何帮助将不胜感激！

Answer 1

编辑以添加额外的解释和阅读：

• https://www.freecodecamp.org/news/js-type-coercion-explained-27ba3d9a2839/
• https://dev.to/promhize/what-you-need-to-know-about-javascripts-implicit-coercion-e23
• https://www.ecma-international.org/ecma-262/6.0/#sec-type-conversion
  （ecma 的表格是最准确和最简洁的，但它的介绍可能有点简陋。老实说，我也不满意博主对隐式强制的过于冗长的解释。）

当任何操作数是字符串时，二进制 + 运算符会触发隐式强制

您需要使用一个数组并推送到它。 使用+运算符会将数组强制转换为字符串并连接字符串。

 var fruits = [["Bananas", "2"], ["Apples", "4"], ["Oranges", "5"]]; var fruitsToday = []; for (i=0; i < fruits.length; i++) { fruitsToday.push(fruits[i].join(" - ")); } document.getElementById("today").innerHTML = fruitsToday.join("<br>");

 <div id="today"></div>

Answer 2

您可以使用 map 连接的项目并将数组用于 output。

 var fruits = [["Bananas", "2"], ["Apples", "4"], ["Oranges", "5"]], fruitsToday = fruits.map(a => a.join(' - ')); document.getElementById("today").innerHTML = fruitsToday.join('<br>');

 <div id="today"></div>

Answer 3

应该在一行中可行:)

 var fruits = [["Bananas", "2"], ["Apples", "4"], ["Oranges", "5"]]; document.getElementById("today").innerHTML = fruits.map(f => f.join(" - ")).join("<br>");

 <span id="today"><span>

Answer 4

您的代码运行良好。 问题是fruitsToday.join("<br>"); 因为fruitsToday是字符串，而join()仅适用于数组。

 var fruits = [["Bananas", "2"], ["Apples", "4"], ["Oranges", "5"]]; var fruitsToday = []; for (i=0; i < fruits.length; i++) { fruitsToday += (fruits[i].join(" - ") + '<br/>'); } document.getElementById("today").innerHTML = fruitsToday;

 <div id=today></div>

Answer 5

问题是数组fruitsToday和索引i -> fruits[i]处的数组之间的隐式字符串连接。

fruitsToday += fruits[i].join(" - ");
            ^

通过调用 function Array.prototype.push更改该串联

 let fruits = [ ["Bananas", "2"], ["Apples", "4"], ["Oranges", "5"] ]; let fruitsToday = []; for (let i = 0; i < fruits.length; i++) { fruitsToday.push(fruits[i].join(" - ")); } document.getElementById("today").innerHTML = fruitsToday.join("<br>");

 <div id="today"></div>

Answer 6

与下面使用 map() 类似，但使用新元素创建所需的新数组“fruitsToday”。 然后，您可以根据需要使用新数组。

 var fruits = [["Bananas", "2"], ["Apples", "4"], ["Oranges", "5"]]; var fruitsToday = []; fruits.map(function(e) {fruitsToday.push(e[0]+" - "+ e[1]);}) console.log(fruitsToday);