如何在javascript上使用for回圈連接兩個陣列？

我想通過 for 回圈合并兩個陣列并將它們分配到一個新陣列中。
我有這兩個陣列：

const drivers = ['Verstappen', 'Hamilton', 'Raikkonen', 'Bottas', 'Lando Norris', 'Leclerc', 'Ricciardo', 'Vettel', 'Stroll', 'Tsunoda'];
const livery = ['Red Bull', 'Mercedes-Benz', 'McLaren', 'Ferrari', 'Aston Martin', 'Alpha Tauri'];

我想為這些“司機”中的每一個分配一個制服（不一定是他們代表的真實身份），但是每次我嘗試調整我的代碼時，我最終都會為每個司機分配所有制服，而我只想給他們一個或者我設法只獲得陣列上最后一個帶有最后一個“制服”的“驅動程式”。

我的代碼的所有版本通常都圍繞著這個：

const drivers = ['Verstappen', 'Hamilton', 'Raikkonen', 'Bottas', 'Lando Norris', 'Leclerc', 'Ricciardo', 'Vettel', 'Stroll', 'Tsunoda'];
const livery = ['Red Bull', 'Mercedes-Benz', 'McLaren', 'Ferrari', 'Aston Martin', 'Alpha Tauri'];
let resultArray = [];

const loopIndex = (arrays, arrays2) => {
    for (i = 0; i < arrays.length; i  )
        for (j = 0; j < arrays2.length; j  )
            resultArray = arrays[i].concat(arrays2[j]);
}; 

loopIndex(drivers, livery);
console.log(resultArray); //Inputs TsunodaAlpha Tauri

預期輸出：

resultArray = ['VerstappenRedBull','HamiltonMercedes Benz','RaikkonenMcLaren','BottasFerrari','Lando NorrisAston Martin','LeclercAlpha Tauri','RicciardoRed Bull','VettelMercedes-Benz','StrollMcLaren','TsunodaFerrari'];

或者類似的東西，我只是想看看是否可以使用 for 回圈將一個驅動程式與一個制服連接起來。

uj5u.com熱心網友回復：

如果要使用 for 回圈，可以執行以下操作：

const drivers = ['Verstappen', 'Hamilton', 'Raikkonen', 'Bottas', 'Lando Norris', 'Leclerc', 'Ricciardo', 'Vettel', 'Stroll', 'Tsunoda'];

const livery = ['Red Bull', 'Mercedes-Benz', 'McLaren', 'Ferrari', 'Aston Martin', 'Alpha Tauri'];

const resultArray = [];

for (let i = 0; i < drivers.length; i  ) {
  const j = i % livery.length;

  resultArray.push(`${drivers[i]} | ${livery[j]}`);
}

/*
or the slightly more compact version, using forEach:

drivers.forEach((driver, index) => {
  const j = index % livery.length;
  
  resultArray.push(`${driver} | ${livery[j]}`);
})
*/

console.log(resultArray);

無論如何，我建議使用Array.prototype.map()：

const drivers = ['Verstappen', 'Hamilton', 'Raikkonen', 'Bottas', 'Lando Norris', 'Leclerc', 'Ricciardo', 'Vettel', 'Stroll', 'Tsunoda'];

const livery = ['Red Bull', 'Mercedes-Benz', 'McLaren', 'Ferrari', 'Aston Martin', 'Alpha Tauri'];

const resultArray = drivers.map((driver, index) => {
  const j = index % livery.length;
  
  return `${driver} | ${livery[j]}`
});

console.log(resultArray)

[編輯] 在線解釋 const j = index % livery.length;

由于drivers和livery陣列有兩種不同的長度，在某些時候你會“用完團隊”，你需要指示你的代碼回到livery陣列的開頭。

const arr1 = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K']
const arr2 = ['a', 'b', 'c', 'd', 'e', 'f']
// expected output: ['Aa', 'Bb', 'Cc', 'Dd', 'Ee', 'Ff', 'Ga', 'Hb', 'Ic', 'Jd', 'Ke'];

第一個嘗試性的方法可能是做這樣的事情：

arr1.forEach((item, indexArr1) => {
  const indexArr2 = indexArr1 < arr2.length ? indexArr1 : indexArr1 - arr2.length
  // ...
})

只要arr1小于arr2;的大小的兩倍，就可以作業。但是如果arr1有 15 個專案并且arr2只有 5 個呢？
當indexArr1是 10 時，indexArr2將計算為 10 - 5 = 5，這不是有效索引arr2（其索引從 0 到 4）。

幸運的是，我們有%運算子，它回傳兩個數字之間的除法提示，并以這種方式作業：

uj5u.com熱心網友回復：

一種方法如下

const drivers = ['Verstappen', 'Hamilton', 'Raikkonen', 'Bottas', 'Lando 
    Norris', 'Leclerc', 'Ricciardo', 'Vettel', 'Stroll', 'Tsunoda'];
const livery = ['Red Bull', 'Mercedes-Benz', 'McLaren', 'Ferrari', 'Aston 
    Martin', 'Alpha Tauri'];
let resultArray = [];

const loopIndex = (arrays, arrays2) => {
    console.log(arrays,arrays2);
    for (i = 0; i < arrays.length; i  )
        resultArray.push(arrays[i])
    for (j = 0; j < arrays2.length; j  )
        resultArray.push(arrays2[j])
}; 

loopIndex(drivers, livery);
console.log(resultArray); //Inputs TsunodaAlpha Tauri

//結果如下（最終陣列包含16個專案，第一個陣列有10個，第二個陣列有6個）

  [1]: https://i.stack.imgur.com/sgrUk.png

uj5u.com熱心網友回復：

根據輸出要求，您需要執行以下操作

const drivers = ['Verstappen', 'Hamilton', 'Raikkonen', 'Bottas', 
'Lando Norris', 'Leclerc', 'Ricciardo', 'Vettel', 'Stroll', 'Tsunoda'];
    const livery = ['Red Bull', 'Mercedes-Benz', 'McLaren', 'Ferrari', 
'Aston Martin', 'Alpha Tauri'];
     let resultArray = [];

     const loopIndex = (arrays, arrays2) => {
        arrays.forEach((arrayItem, i) =>
        {
            const j = i % arrays2.length;
            resultArray.push(`${arrayItem}${arrays2[j]}`)
        });
    }; 

loopIndex(drivers, livery);
console.log(resultArray); //Inputs TsunodaAlpha Tauri

標籤：javascript 数组 for循环

上一篇：如何更改回圈以反轉Javascript中的方形列印

下一篇：回圈以將串列附加字典中的字典鍵與其他列中的關聯資料相匹配