[removed] Difference between .forEach() and .map()

后端 未结 12 1901
余生分开走
余生分开走 2020-11-22 15:19

I know that there were a lot of topics like this. And I know the basics: .forEach() operates on original array and .map() on the new one.

I

相关标签:
12条回答
  • 2020-11-22 15:38

    The difference lies in what they return. After execution:

    arr.map()
    

    returns an array of elements resulting from the processed function; while:

    arr.forEach()
    

    returns undefined.

    0 讨论(0)
  • 2020-11-22 15:39

    Performance Analysis For loops performs faster than map or foreach as number of elements in a array increases.

    let array = [];
    for (var i = 0; i < 20000000; i++) {
      array.push(i)
    }
    
    console.time('map');
    array.map(num => {
      return num * 4;
    });
    console.timeEnd('map');
    
    
    console.time('forEach');
    array.forEach((num, index) => {
      return array[index] = num * 4;
    });
    console.timeEnd('forEach');
    
    console.time('for');
    for (i = 0; i < array.length; i++) {
      array[i] = array[i] * 2;
    
    }
    console.timeEnd('for');
    
    0 讨论(0)
  • 2020-11-22 15:40

    Diffrence between Foreach & map :

    Map() : If you use map then map can return new array by iterating main array.

    Foreach() : If you use Foreach then it can not return anything for each can iterating main array.

    useFul link : use this link for understanding diffrence

    https://codeburst.io/javascript-map-vs-foreach-f38111822c0f

    0 讨论(0)
  • 2020-11-22 15:45
    ╓════════════════╥═════════════════════════════════════╥═══════════════════════════════════════╕
    ║                ║ foreach                             ║ map                                   ║
    ╠════════════════╫═════════════════════════════════════╫═══════════════════════════════════════╢
    ║ Functionality  ║ Performs given operation on each    ║ Performs given "transformation" on    ║
    ║                ║ element of the array                ║ "copy" of each element                ║
    ╠————————————————╫—————————————————————————————————————╫———————————————————————————————————————╢
    ║ Return value   ║ Returns undefined                   ║ Returns new array with tranformed     ║
    ║                ║                                     ║ elements leaving back original array  ║
    ║                ║                                     ║ unchanged                             ║
    ╠————————————————╫—————————————————————————————————————╫———————————————————————————————————————╢
    ║ Preferrable    ║ Performing non—transformation like  ║ Obtaining array containing output of  ║
    ║ usage scenario ║ processing on each element.         ║ some processing done on each element  ║
    ║ and example    ║                                     ║ of the array.                         ║
    ║                ║ For example, saving all elements in ║                                       ║
    ║                ║ the database                        ║ For example, obtaining array of       ║
    ║                ║                                     ║ lengths of each string in the         ║
    ║                ║                                     ║ array                                 ║
    ╙════════════════╨═════════════════════════════════════╨═══════════════════════════════════════╜
    
    0 讨论(0)
  • 2020-11-22 15:49

    forEach() :

    return value : undefined

    originalArray : not modified after the method call

    newArray is not created after the end of method call.

    map() :

    return value : new Array populated with the results of calling a provided function on every element in the calling array

    originalArray : not modified after the method call

    newArray is created after the end of method call.

    Since map builds a new array, using it when you aren't using the
    returned array is an anti-pattern; use forEach or for-of instead.
    
    0 讨论(0)
  • 2020-11-22 15:53
    • Array.forEach “executes a provided function once per array element.”

    • Array.map “creates a new array with the results of calling a provided function on every element in this array.”

    So, forEach doesn’t actually return anything. It just calls the function for each array element and then it’s done. So whatever you return within that called function is simply discarded.

    On the other hand, map will similarly call the function for each array element but instead of discarding its return value, it will capture it and build a new array of those return values.

    This also means that you could use map wherever you are using forEach but you still shouldn’t do that so you don’t collect the return values without any purpose. It’s just more efficient to not collect them if you don’t need them.

    0 讨论(0)
提交回复
热议问题