jQuery映射与每个

Question

在jQuery中，map和each函数似乎做同样的事情。两者之间是否有实际区别？您什么时候选择使用一种而不是另一种？

Answer 1

该each方法原本是一个不变的迭代器，map可以用作迭代器，但实际上是要操纵提供的数组并返回一个新数组。

另一个要注意的重要事项是，该each函数返回原始数组，而该map函数返回一个新数组。如果您过度使用map函数的返回值，则可能会浪费大量内存。

例如：

var items = [1,2,3,4];

$.each(items, function() {

  alert('this is ' + this);

});

var newItems = $.map(items, function(i) {

  return i + 1;

});

// newItems is [2,3,4,5]

您还可以使用map函数从数组中删除项目。例如：

var items = [0,1,2,3,4,5,6,7,8,9];

var itemsLessThanEqualFive = $.map(items, function(i) {

  // removes all items > 5

  if (i > 5) 

    return null;

  return i;

});

// itemsLessThanEqualFive = [0,1,2,3,4,5]

您还将注意到，this该map函数未映射。您将必须在回调中提供第一个参数（例如，我们在i上面使用的）。具有讽刺意味的是，每个方法中使用的回调参数与map函数中的回调参数相反，因此请小心。

map(arr, function(elem, index) {});

// versus 

each(arr, function(index, elem) {});

Answer 2

1：回调函数的参数相反。

.each()的，$.each()'s和.map()的回调函数走索引第一，然后将元件

function (index, element) 

$.map()的回调具有相同的参数，但取反

function (element, index)

2： ，.each()，$.each()和.map()做一些特别的东西用this

each()以this指向当前元素的方式调用函数。在大多数情况下，您甚至不需要在回调函数中使用两个参数。

function shout() { alert(this + '!') }

result = $.each(['lions', 'tigers', 'bears'], shout)

// result == ['lions', 'tigers', 'bears']

对于$.map()该this变量是指在全局窗口对象。

3：map()对回调的返回值做一些特殊的事情

map()调用每个元素上的函数，并将结果存储在新数组中，并返回该数组。通常，您只需要在回调函数中使用第一个参数。

function shout(el) { return el + '!' }

result = $.map(['lions', 'tigers', 'bears'], shout)

// result == ['lions!', 'tigers!', 'bears!']

Answer 3

的each一个数组函数迭代，调用提供的函数每一次元件，和设置this于所述有源元件。这个：

function countdown() {

    alert(this + "..");

}

$([5, 4, 3, 2, 1]).each(countdown);

会提醒5..，然后4..再3..然后2..再1..

另一方面，Map接受一个数组，并返回一个新数组，其中每个元素均由函数更改。这个：

function squared() {

    return this * this;

}

var s = $([5, 4, 3, 2, 1]).map(squared);

会导致s被[25, 16, 9, 4, 1]。