Javascript循环并连接2个数组答案

【问题标题】：Javascript Loop through and Concatenate 2 arraysJavascript循环并连接2个数组
【发布时间】：2017-02-28 13:07:26
【问题描述】：

我正在尝试循环并连接 2 个数组，如下所示，我不知道会有多少值，因为用户可以购买 1 或 100 个产品，因此需要循环。

Array1 = ['ABC', 'DEF', 'GHI']

Array2 = ['123', '45', '6789',]

我需要输出为：

ABC:123|DEF:45|GHI:6789

目前我的代码...

function() {
  var array_one = ['ABC', 'DEF', 'GHI', 'JKL'];
  var array_two = ['179.99', '349.99', '399.99', '389'];
  for (var i = 0; i < array_one.length; i++) {
    for (var j = 0; j < array_two.length; j++) {
      return(array_one[i] + ":" + array_two[j] + "|");
    }
  }
}

这仅输出一个值并且不会循环，我的循环中断的任何想法。

【问题讨论】：

标签： javascript loops for-loop

【解决方案1】：

如果您知道两个数组的长度相同，那么简单的映射就足够了：

var array1 = ['ABC', 'DEF', 'GHI']
var array2 = ['123', '45', '6789']

var result = array1.map(function(item, index) {
  return item + ':' + array2[index]
}).join('|')

console.log(result)

或者 ES2015 版本：

var result = array1.map((item, index) => `${item}:${array2[index]}`).join('|')

【讨论】：

【解决方案2】：

您可以使用map() 从array_two 添加元素，然后使用join() 创建字符串。

var array_one = ['ABC', 'DEF', 'GHI', 'JKL'];
var array_two = ['179.99', '349.99', '399.99', '389'];

var result = array_one.map(function(e, i) {
  return e + ':' + array_two[i]
}).join('|')

console.log(result)

【讨论】：

【解决方案3】：

您可以使用Array.reduce

var array_one = ['ABC', 'DEF', 'GHI', 'JKL'];
var array_two = ['179.99', '349.99', '399.99', '389'];

var result = array_one.reduce(function(p, c, i, a) {
  p += c + ":" + array_two[i]
  if (i < a.length - 1)
    p+="|"
  return p;
}, "")

console.log(result)

带有for循环

var array_one = ['ABC', 'DEF', 'GHI', 'JKL'];
var array_two = ['179.99', '349.99', '399.99', '389'];

var result = "";
for(var i = 0; i< array_one.length; i++){
  result += array_one[i] + ":" + array_two[i]
  if (i < array_one.length - 1)
    result += "|"
}
console.log(result)

【讨论】：

【解决方案4】：

你的逻辑有点错误，你真的不需要两个循环。一个循环就可以做到，而且你不应该在循环内返回。

由于它们的大小相同，所以下面的代码应该这样做

var result="";
for (var i = 0; i < array_one.length; i++) {     
     result += (array_one[i] + ":" + array_two[i] + "|");    
}
return result;

【讨论】：

应该array_two[2] 是array_two[i]？
@Rajesh Ahh，我的错。已更正。谢谢你
另一个更正，您每次都添加"|"。上次迭代不应该发生这种情况。

【解决方案5】：

这只会输出一个值，不会循环，任何想法我的循环中断的地方。

是什么原因？

它只返回一个值，因为您在第一次迭代中使用了return 关键字，因此它将在第一次迭代中退出。

错误发生在哪里？

下面的代码是循环中断的地方：

 return(array_one[i] + ":" + array_two[j] + "|");

如何解决问题？

Note ：在这种情况下实际上不需要嵌套循环，因为两个数组的长度相同，因此我们可以简化它。

为了改进您当前的解决方案，我们可以创建一个字符串变量并将结果附加到那里，例如：

function() {
  var array_one = ['ABC', 'DEF', 'GHI', 'JKL'];
  var array_two = ['179.99', '349.99', '399.99', '389'];
  var result = "";
  for (var i = 0; i < array_one.length; i++) {
     result += array_one[i] + ":" + array_two[i] + "|";
  }
  return result;
}

【讨论】：

这非常有效。我刚刚添加了一个 result = result.slice(0,-1) 来删除最后未使用的 '|'象征。谢谢你的帮助。

【解决方案6】：

var arr1 = ['ABC', 'DEF', 'GHI'],
    arr2 = ['123', '45', '6789'],
    result = '';
    
    //iterate over every element from arr1 and add it into the 
    //result string with corresponding value from arr2
    arr1.forEach((v,i) => result += v + ':' + arr2[i] + '|'); 
    console.log(result.slice(0, -1)); //cut the `|` sign from the end of the string

【讨论】：

【解决方案7】：

只需一个“for 循环”即可获得所需的输出

     var  returnValue = "";
     for (var i = 0; i < array_one.length; i++)
        {
        returnValue+ =array_one[i] + ":" + array_two[j] + "|";
        }
     return  returnValue;

【讨论】：