Was ist das Konzept von Array.map?

Question

Ich habe Probleme, das Konzept von zu verstehen. Ich habe Mozilla und Tutorials Point besucht, aber sie haben nur sehr begrenzte Informationen dazu geliefert.

So verwende ich . Es ist ein wenig Komplex (ein bisschen d3.js beteiligt, es einfach ignorieren)

var mapCell = function (row) { 
    return columns.map(function(column) { 
     return { column : column, value : getColumnCell(row, column) } 
    }) 
} 
//getColumnCell is a function defined in my code 
//columns is array defined at the top of my code 

Ich verstehe nicht genau das, was dieser Code tut. Ich weiß, dass es ein neues Array und Zeug zurückgibt, aber dieser Teil ist ein wenig schwierig!

, wenn Sie durch meinen Code hinwollen: http://jsfiddle.net/ddfsb/2/

UPDATE 1

I Konsole in dem Code, was geschieht, um tatsächlich zu verstehen verwenden. Wenn ich mir die Antworten ansehe, habe ich das Konzept von array.map klar verstanden. Nun ist der einzige Teil verbleibenden Parameter Zeilen und Spalten, aber es gibt einen Unterschied zwischen Zeile und Zeilen und Spalten und Spalten in der Geige vorgesehen

var rows//completely ok 
var columns//completely ok 
funcion(row)//here,source of row is unknown.getColumncell function utilizes this parameter further making it more critical 
function(column)//source of column is unknown..getColumncell function utilizes this parameter further making it more critical 

Jede Hilfe ??

Answer 1

Lassen Sie uns ein wenig umschreiben und beginnen Sie von innen nach außen zu arbeiten.

var mapCell = function (row) { 
    return columns.map(
    function(column) { 
     return { 
     column : column, 
     value : getColumnCell(row, column) 
     } 
    } 
) 
} 

Der function(column) Teil ist im wesentlichen eine Funktion, die eine Spalte als Parameter nimmt, und gibt ein neues Objekt mit zwei Eigenschaften:

• Säule, das heißt der ursprüngliche Wert des Parameters und
• Wert, das ist das Ergebnis auf der Zeile (externe Variable) und die Spalte getColumnCell Funktion des Aufrufs (Parameter)

die columns.map() Teil ruft die Array.map-Funktion auf, die ein Array und eine Funktion übernimmt und die Funktion für jedes letzte Element ausführt und die Ergebnisse zurückgibt. Wenn der Eingang das Array [1, 2, 3, 4, 5] ist und die Funktion etwa isEven ist, wird das Ergebnis das Array [false, true, false, true, false] sein. In Ihrem Fall sind die Eingabe die Spalten, und die Ausgabe ist eine Liste von Objekten, von denen jedes eine Spalte und einen Wert Eigenschaften hat.

Schließlich ist der var mapCell = function (row) Teil erklärt, dass die Variable mapCell eine Funktion einer Variablen row genannt enthalten wird - und das ist das gleiche row, die in der inneren Funktion verwendet wird.

In einem einzigen Satz deklariert diese Codezeile eine Funktion, die beim Ausführen eine Zeile aufruft und Werte für alle Spalten dieser Zeile zurückgibt.

Answer 2

map Durchläuft Ihr ursprüngliches Array und ruft die Methode für jeden Wert im Array auf. Es sammelt die Ergebnisse Ihrer Funktion, um ein neues Array mit den Ergebnissen zu erstellen. Sie ordnen das Array von Werten einem neuen Array von zugeordneten Werten zu. Ihr Code entspricht:

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; 
}; 

Answer 3

die Kartenfunktion zu verstehen, ist nur ein Teil der Lösung hier gibt es auch die Funktion mapCell. Es nimmt einen Parameter row und es gibt so etwas wie:

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

Wo der Zellenwert auf der row und der Säule abhängt (Parteien, Sterne-sprechen etc.)

Eine Map-Funktion wendet eine Transformation auf ein Wert und gibt diesen umgewandelten Wert zurück.

Ein einfaches Beispiel:

function square(x) { return x * x; } 

[ 2, 3, 4 ].map(square); // gives: [ 4, 9, 16 ] 

ähnlich:

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

Da nun die Karte mit einer Funktion verschachtelt ist, die einen row Parameter bekommt. Sie können es in der Kartenfunktion verwenden, um zu erhalten:

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

Und das wird ziemlich nah an Ihrem Code.

Answer 4

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 

Answer 5

Wahrscheinlich ist die meisten Menschen hier (wie ich) kommen wollen nur ein grundlegendes array.map Verwendungsbeispiel:

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] 

Das ist es an ihn grundlegendsten ist. Weitere Parameter finden Sie unter: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map