javascript循环数组中的项

javascript looping items in array

本文关键字:数组 循环 javascript      更新时间:2023-09-26

我现在脑子里一片空白。。我有一系列的月份:

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>  

循环遍历数组不是问题,但我现在想不出的是一种优雅的方法,可以循环遍历数组中的每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个项目分组的最佳方法吗?

有时候.for loop就足够了!为什么不在循环month_array[++i];中尝试这个呢?或者在.for语句中简单而更好的i += 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+=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>
演示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>

虽然我认为像@Regent在评论中建议的那样,只使用常规for循环要容易得多,但您可以使用这样的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个月的情况下,这显然不是问题。

编辑,更新。保留原始数组。

尝试

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));

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

你正在寻找的答案

<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/

还签出输出标记