2014-10-06 4 views
1

Мой ум рисует пустой прямо сейчас .. У меня есть массив месяцев:JavaScript перекручивание элементов в массиве

var month_array = new Array(); 

month_array[0] = "January"; 
month_array[1] = "February"; 
month_array[2] = "March"; 
month_array[3] = "April"; 
month_array[4] = "May"; 
month_array[5] = "June"; 
month_array[6] = "July"; 
month_array[7] = "August"; 
month_array[8] = "September"; 
month_array[9] = "October"; 
month_array[10] = "November"; 
month_array[11] = "December"; 

Я пытаюсь вывода разметке как:

<ul> 
    <li> January & Feburary </li> 
    <li> March & April </li> 
etc. 
</ul> 

Looping через массив не проблема, но то, что я не могу понять сейчас, - это элегантный способ петли через каждые 2 элемента массива.

Я могу сделать это, используя нижеследующее для форматирования массива Мне это нужно, но я думаю это не хорошее направление, как его избыточность.

var months = month_array.map(function(elem,i,arr){ 
       return [elem, (i+1<arr.length) ? arr[i+1] : null]; 
      }).filter(function(elem,i){ 
       return (i%2); 
      }); 

Кто-нибудь знает, как наилучшим образом группировать по 2 элементам в массиве?

+6

'for (var i = 0; i Regent

+2

vanilla 'for' loop,' i + = 2'? –

+2

Вы, кажется, слишком усложняете это, пытаясь использовать '.map', а не просто обычный старый цикл' for'. И ваша попытка не только слишком сложна, но и не работает. Первый элемент: [Feburary], [March] ' –

ответ

1

Хотя я думаю, что это способ проще всего использовать обычный for цикл, как @Regent предложил в комментариях, вы можете сделать это с array.reduce вроде этого:

var months = month_array.reduce(function (pre, curr, idx, arr) { 
    if (!(idx % 2)) { 
     pre.push([curr, arr[idx + 1]]); 
    } 
    return pre; 
}, []); 

console.log(months); 

Это даст вам массив, содержащий шесть массивов, каждый из которых содержит два месяца, начиная с ["January","February"]

Примечание: в случае группировки массив с нечетным числом элементов, последний элемент в вашем пониженном массиве будет [lastItemInSourceArray, undefined]. Вы можете добавить логику для обработки этого случая, если это необходимо, в зависимости от того, что вам действительно нужно делать. В случае 12 месяцев это, очевидно, не проблема.

4

Иногда .for loop вполне достаточно! Почему бы вам не попробовать этот внутренний цикл month_array[++i]; Или просто и лучше i += 2 на .for заявление:

Demo 1:

var month_array = new Array(); 
 
var cList = $('ul.mylist') 
 
month_array[0] = "January"; 
 
month_array[1] = "February"; 
 
month_array[2] = "March"; 
 
month_array[3] = "April"; 
 
month_array[4] = "May"; 
 
month_array[5] = "June"; 
 
month_array[6] = "July"; 
 
month_array[7] = "August"; 
 
month_array[8] = "September"; 
 
month_array[9] = "October"; 
 
month_array[10] = "November"; 
 
month_array[11] = "December"; 
 

 
for (var i = 0, l = month_array.length; i < l; i+=2) { 
 
var final = month_array[i] + " & " + month_array[i + 1]; 
 
var li = $('<li/>').html(final).appendTo(cList); 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul class="mylist"> 
 
</ul>
Demo 2 - Выберите демо-1 лучше !:
var month_array = new Array(); 
 
var cList = $('ul.mylist') 
 
month_array[0] = "January"; 
 
month_array[1] = "February"; 
 
month_array[2] = "March"; 
 
month_array[3] = "April"; 
 
month_array[4] = "May"; 
 
month_array[5] = "June"; 
 
month_array[6] = "July"; 
 
month_array[7] = "August"; 
 
month_array[8] = "September"; 
 
month_array[9] = "October"; 
 
month_array[10] = "November"; 
 
month_array[11] = "December"; 
 

 
for (var i = 0, l = month_array.length; i < l; i++) { 
 
    var final = month_array[i] + " & " + month_array[++i]; 
 
    var li = $('<li/>').html(final).appendTo(cList); 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul class="mylist"> 
 
</ul>

+2

Изменение контрольной переменной в цикле заставит некоторых людей рассердиться, 'i + = 2' делает все ясно. –

+0

Я сделал это, чтобы понять, какой предмет показывает для него. Я знал это. Но в любом случае это странный вопрос. Возможно, я сделал не так, чтобы ответить на это так или иначе –

+1

Вы могли бы изменить на + = 2;) –

0

Редактировать, обновить. Сохраняет исходный массив.

Попробуйте

v3

var ul = $("<ul>"); 
var month_array = ["January", "February", "March", "April" 
        , "May", "June", "July", "August" 
        , "September", "October", "November", "December"]; 

(function arr(m, n) { 
    if (ul.children("li").size() < m.length/2) { 
     ul.append("<li>" 
        + m.slice(n, n + 2).join(" & ") 
        + "</li>"); 
        n = n + 2; 
     arr(m, n) 
    } else { 
     $("body").append(ul); 
     console.log(month_array) 
    } 
}(month_array, 0)); 

jsfiddle http://jsfiddle.net/guest271314/orrje6qo/4/

+1

Ну, это работает, но в чем смысл перенапряжения задачи и уничтожения массива? – Regent

0

Ответ на этот вопрос у ¨R ищет .. !!

<body> 
    <div class="listDiv"> 
    <ul></ul> 
    </div> 
</body> 



var month_array = []; 
month_array[0] = "January"; 
month_array[1] = "February"; 
month_array[2] = "March"; 
month_array[3] = "April"; 
month_array[4] = "May"; 
month_array[5] = "June"; 
month_array[6] = "July"; 
month_array[7] = "August"; 
month_array[8] = "September"; 
month_array[9] = "October"; 
month_array[10] = "November"; 
month_array[11] = "December"; 
var array=[]; 
for(var i=1; i<month_array.length; ++i) { 
    array[i] = '<li>' + month_array[i-1] + ' & ' +month_array[i] + '</li>'; 
} 

$('.listDiv ul').append(array); 

http://jsfiddle.net/raeegzrb/

контроль выходной разметки, а также.

Смежные вопросы