使用 Javascript 合並 Arrays

Question

如果之前已經在這里問過這個問題，我很抱歉，但我找不到它。

我無法將兩個 arrays 合並在一起，我是 javascript 的絕對初學者。

我需要在純 javascript 中執行此操作，並且不使用任何庫代碼。

這是代碼；

var greetings = [
  'Hello',
  'Bonjour',
  'Ola',
],

names = {
  'One': 'Bill',
  'Two': 'John',
  'Three': 'Paul',
};

我希望結果在無序列表中顯示為以下內容，並且每個語句都在其中自己的單獨列表項；

<ul>
   <li>Hello Bill</li><br/>
   <li>Bonjour John</li><br/>
   <li>Ola Paul</li><br/>
</ul>

如果有人能回答這個問題，並評論代碼，這樣我就可以理解它是如何工作的，那將是完美的。

Answer 1

使用for-in語句時不能保證枚舉的順序。

因此，您需要有一個單獨的數組來指定順序。

var greetings = [
  'Hello',
  'Bonjour',
  'Ola',
],

names = {
  'One': 'Bill',
  'Two': 'John',
  'Three': 'Paul',
},

order = [
   'One',
   'Two',
   'Three'
], 

items = [];

for( var i = 0, len = order.length; i < len; i++ ) {
   items.push( greetings[i] + ' ' + names[ order[i] ] );
}

document.body.innerHTML = ( "<ul><li>" + items.join("</li><li>") + "</li></ul>" );

但這會很痛苦。 您應該改用 2 Arrays。

示例： http://jsfiddle.net/rktyF/1/

編輯：我擺脫了<br>因為它是不必要的。

Answer 2

用於... in，例如如下：

var i = 0, lst = [];
for(pos in names) {
  lst.push(greetings[i++] + " " + names[pos]);
}

Answer 3

我不明白{ 'One': 'Bill', 'Two': 'John', 'Three': 'Paul', } ... 為什么不[ 'Bill', 'John', 'Paul' ] ？

如果你這樣做，它將是：

var ul = document.createElement( 'ul' ),
li;
for ( var i = 0, l = greetings.length; i < l; ++i ) {
    li = document.createElement( 'li' );
    li.innerHTML = greetings[ i ] + ' ' + names[ i ];
    ul.appendChild( li );
}

Answer 4

我希望你的意思是..

names = ['Bill', 'John', 'Paul'];

..因為您在問題中顯示的names不是數組。 這是一個 object。

另外，為了將來參考，數組從 0 開始，而不是 1，所以..

names[1];

..會是約翰，盡管比爾是第一個。

var i = 0, // Arrays start at 0.
    ul = document.createElement('ul'), // Create the unordered list.
    greetings = [ 'Hello', 'Bonjour', 'Ola' ], // Make some greetings.
    names = [ 'Bill', 'John', 'Paul' ]; // Make some names.

for (; i < names.length; i++) {
    var li = document.createElement('li'); // Create a list item.

    li.innerHTML = greetings[i] + ' ' + names[i]; // Set the HTML.

    ul.appendChild(li); // Make the list item part of the list.
};

document.body.appendChild(ul); // Put the list inside the body of the document.

那應該行得通。

我在這里設置了一個演示。

Answer 5

似乎@patrick 擊敗了我的一般解決方案，但無論如何我都會把它留在這里：

var greetings = [
  'Hello',
  'Bonjour',
  'Ola'
],

names = {
  'One': 'Bill',
  'Two': 'John',
  'Three': 'Paul'
};

var words = ["One", "Two", "Three", "Four", "Five", 
             "Six", "Seven", "Eight", "Nine"];
var i, greet;
var ul = document.createElement("ul");
for (i = 0; greet = greetings[i++];) {
    var li = document.createElement("li");
    li.appendChild(document.createTextNode(
        greet + " " + names[words[i]]))
    ul.appendChild(li);
}

您現在可以將ul插入到 DOM 中相應的 position 中。 其結構：

<ul>
    <li>Hello John</li>
    <li>Bonjour Paul</li>
    <li>Ola undefined</li>
</ul>