如何同时打印多个数组的结果

How to print results from multiple arrays simanteously?

本文关键字:数组 结果 何同时 打印      更新时间:2023-09-26

我在从每个数组索引按顺序打印多个数组值时遇到问题。我有三个数组,我只想迭代一次。假设在$.each()的选择器参数中定义了三个数组,$.each()函数在整个数组上迭代三次。这是我在jsfiddle中的代码和输出。

var _videoIdArr = ["via1","via2", "via3", "via4", "via5"];
var _vidTitleArr = ["t1", "t2", "t3", "t4", "t5"]; 
var _viewCountArr = ["v1", "v2", "v3", "v4", "v5"]; 
// loop thru multiple arrays and print total values
$.each([_videoIdArr, _vidTitleArr, _viewCountArr], function()
{
   $.each(this, function(i, item)
   {
      // construct the div
      vidThumbnail = '<div class="video">ID: ' + _videoIdArr[i] + '<br/>Title: ' + _vidTitleArr[i] + '<br/>Count: ' + _viewCountArr[i] + '</div>';
     console.log(vidThumbnail);
     // print the div
     $('.section.video > .thumb').append(vidThumbnail);
    });
});

使用经典的for循环怎么样?假设有三个阵列的长度与它看起来应该工作的长度相同:

for (var i = 0; i < _videoIdArr.length; i++) {
  vidThumbnail = '<div class="video">ID: ' + _videoIdArr[i] + '<br/>Title: ' + _vidTitleArr[i] + '<br/>Count: ' + _viewCountArr[i] + '</div>';
  console.log(vidThumbnail);
  // print the div
  $('.section.video > .thumb').append(vidThumbnail);
}

或者,如果你想使用$.each,你可以只使用索引变量:

$.each(_videoIdArr, function(i) {
  vidThumbnail = '<div class="video">ID: ' + _videoIdArr[i] + '<br/>Title: ' + _vidTitleArr[i] + '<br/>Count: ' + _viewCountArr[i] + '</div>';
  console.log(vidThumbnail);
  // print the div
  $('.section.video > .thumb').append(vidThumbnail);
});

假设所有数组都有相同的长度,并且没有丢失的属性,则只需要一个each循环:

var _videoIdArr = ["via1", "via2", "via3", "via4", "via5"];
var _vidTitleArr = ["t1", "t2", "t3", "t4", "t5"];
var _viewCountArr = ["v1", "v2", "v3", "v4", "v5"];
// loop thru multiple arrays and print total values
$.each(_videoIdArr, function(i, item) {
  // construct the div
  vidThumbnail = '<div class="video">ID: ' + _videoIdArr[i] + '<br/>Title: ' + _vidTitleArr[i] + '<br/>Count: ' + _viewCountArr[i] + '</div>';
  console.log(vidThumbnail);
  // print the div
  $('body').append(vidThumbnail);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

您可以使用Array.concat() ,.apply()`将所有数组组合为单个数组

$.each([].concat.apply([], [_videoIdArr, _vidTitleArr, _viewCountArr])
, function(i, item) {
  // construct the div
  var vidThumbnail = '<div class="video">ID: ' 
                     + item + '<br/>Title: ' 
                     + item + '<br/>Count: ' 
                     + item + '</div>';
  console.log(vidThumbnail);
  // print the div
  $('.section.video > .thumb').append(vidThumbnail);
});

jsfiddlehttps://jsfiddle.net/jnksv4zp/1/