jQuery map vs each

Question

In jQuery  the map and each functions seem to do the same thing  Are there any practical differences between the two  When would you choose to use one instead of the other

User · Answer

Jquery map makes more sense when you are doing work on arrays as it performs very well with arrays   Jquery each is best used when iterating through selector items  Which is evidenced in that the map function does not use a selector       selector  each         map arr        as you can see  map is not intended to be used with selectors

User · Answer

i understood it by this   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     so   each  function returns the original array while  map  function returns a new array

User · Answer

1  The arguments to the callback functions are reversed    each   s    each   s  and  map   s callback function take the index first  and then the element  function  index  element       map   s callback has the same arguments  but reversed  function  element  index    2   each      each    and  map   do something special with this  each   calls the function in such a way that this points to the current element  In most cases  you don t even need the two arguments in the callback function   function shout     alert this           result     each   lions    tigers    bears    shout      result      lions    tigers    bears     For   map   the this variable refers to the global window object   3  map   does something special with the callback s return value  map   calls the function on each element  and stores the result in a new array  which it returns  You usually only need to use the first argument in the callback function   function shout el    return el          result     map   lions    tigers    bears    shout      result      lions     tigers     bears

User · Answer

The each method is meant to be an immutable iterator  where as the map method can be used as an iterator  but is really meant to manipulate the supplied array and return a new array   Another important thing to note is that the each function returns the original array while the map function returns a new array    If you overuse the return value of the map function you can potentially waste a lot of memory   For example   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    You can also use the map function to remove an item from an array   For example   var items    0 1 2 3 4 5 6 7 8 9    var itemsLessThanEqualFive     map items  function i         removes all items  gt  5   if  i  gt  5       return null    return i         itemsLessThanEqualFive    0 1 2 3 4 5    You ll also note that the this is not mapped in the map function   You will have to supply the first parameter in the callback  eg we used i above    Ironically  the callback arguments used in the each method are the reverse of the callback arguments in the map function so be careful   map arr  function elem  index          versus  each arr  function index  elem

User · Answer

The each function iterates over an array  calling the supplied function once per element  and setting this to the active element  This   function countdown         alert this                5  4  3  2  1   each countdown     will alert 5   then 4   then 3   then 2   then 1    Map on the other hand takes an array  and returns a new array with each element changed by the function  This   function squared         return this   this     var s      5  4  3  2  1   map squared     would result in s being  25  16  9  4  1

User · Answer

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

[javascript] jQuery map vs. each

Examples related to javascript

Examples related to jquery