What is the concept of Array.map?

前端 未结 8 1787
甜味超标
甜味超标 2020-11-30 06:36

I am having problems understanding the concept of Array.map. I did go to Mozilla and Tutorials Point, but they provided very limited info regarding this.

<
相关标签:
8条回答
  • 2020-11-30 07:14

    Javascript map() Syntax

    arrayObj.map(callback[,context]);

    arrayObj is a original array on which map() is invoked.

    The map() takes 2 named arguments, First is a callback function and the second is a context object. callback function gets triggered on every element of an array.

    In addition, callback function takes 3 arguments:

    function callback(currentElement,index,array){

    }

    currentElement – This is a current elements of array which is passed to callback function

    index – Index of the current element

    array – complete array on which map() is applied

    Out of these 3 elements, currentElement parameter is mandatory while the rest 2 parameters are optional.

    However, map() does not change the original array, it creates a new array element which is generated by callback function.

    You can read more on JavaScript map function

    0 讨论(0)
  • 2020-11-30 07:15

    map loops through your original array and calls the method for each value in the array. It collects the results of your function to create a new array with the results. You are "mapping" the array of values into a new array of mapped values. Your code is equivalent to:

    var mapCell = function (row) {
        var result = [];
            for (var i = 0; i < columns.length; ++i) {
                var mappedValue = {
                    column: columns[i], 
                    value : getColumnCell(row, columns[i])
                };
                result.push(mappedValue);
            }
        return result;
    };
    
    0 讨论(0)
  • 2020-11-30 07:21

    IF you have an array of elements and you have to perform the same operation on the each element of the array that time you can use the javascript map function for array it helps to iterate throw the array then we can perform the operation of each element and return it.

    let NumberArray = [1,2,3,4,5,6,7,8];
    
    let UpdatedArray = NumberArray.map( (Num , index )=>{ 
                    return Num*10;
                })
    
    console.log(UpdatedArray);
    
    //UpdatedArray ==> [10, 20, 30, 40, 50, 60, 70, 80]
    
    0 讨论(0)
  • 2020-11-30 07:24

    Understanding the map function is only part of the solution here, there is also the function mapCell. It takes one parameter row and it returns something like:

    [ {
        "column": "parties",
        "value": [cell value]
    }, {
        "column": "star-speak",
        "value": [cell value]
    } ]
    

    Where the cell value depends on the row and the column (parties, stars-speak etc.)

    A map function applies a transformation to a value, and returns that transformed value.

    A simple example:

    function square(x) { return x * x; }
    
    [ 2, 3, 4 ].map(square); // gives: [ 4, 9, 16 ]
    

    Similarly:

    [ "parties", "starspeak" ].map(function (column) {
        return {
            column: column,
            value: findTheValue(column)
        }
    });
    

    Now since that map is nested with a function that gets a row parameter. You can use it in the map function, to get:

    function (row) {
        return [ "parties", "starspeak" ].map(function (column) {
            return {
                column: column,
                value: findTheValue(row, column)
            }
        });
    }
    

    And this gets pretty close to your code.

    0 讨论(0)
  • 2020-11-30 07:26

    Probably most people coming here (like me) just want a basic array.map usage example:

    myArray = [1,2,3]
    mappedArray = [];
    
    mappedArray = myArray.map(function(currentValue){
         return currentValue *= 2;
    })
    
    //myArray is still [1,2,3]
    //mappedArray is now [2,4,6]
    

    This is it at it's most basic. For additional parameers, check out: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map

    0 讨论(0)
  • 2020-11-30 07:27
    Map function goes through each element of an array in ascending order and invokes function f on all of them. 
    It returns new array which is being computed after function is invoked on it.
    
    Ref: http://www.thesstech.com/javascript/array_map_method
    
    Syntax
    array.map(f)
    
    Example:
    
    <!doctype html>
    <html>
     <head>
     <script>
       var arr = [4,5,6];
       document.write(arr.map(function(x){return x*2;}));
     </script>
     </head>
    </html>
    
    Answer: 8,10,12
    Ref: http://www.thesstech.com/tryme?filename=javascript_array_map_method
    
    0 讨论(0)
提交回复
热议问题