[javascript] jQuery 맵과 각각

이 each메소드는 불변의 반복자입니다. 이 메소드는 반복자 map로 사용할 수 있지만 실제로는 제공된 배열을 조작하고 새 배열을 리턴합니다.

주목해야 할 또 다른 중요한 사항은 each함수가 원래 배열을 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) {});

답변

function (index, element) 

function (element, index)

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

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

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

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

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

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

function countdown() {
    alert(this + "..");
}

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

function squared() {
    return this * this;
}

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

function fun1() {
    return this + 1;
}
function fun2(el) {
    return el + 1;
}

var item = [5,4,3,2,1];

var newitem1 = $.each(item, fun1);
var newitem2 = $.map(item, fun2);

console.log(newitem1); // [5, 4, 3, 2, 1] 
console.log(newitem2); // [6, 5, 4, 3, 2] 

var intArray = [1, 2, 3, 4, 5];
//lets use each function
$.each(intArray, function(index, element) {
  if (element === 3) {
    return false;
  }
  console.log(element); // prints only 1,2. Breaks the loop as soon as it encountered number 3
});

//lets use map function
$.map(intArray, function(element, index) {
  if (element === 3) {
    return false;
  }
  console.log(element); // prints only 1,2,4,5. skip the number 3.
});

$(selector).each(...)

$.map(arr....)