javascript - index - map js




Какова концепция Array.map? (4)

У меня проблемы с пониманием концепции Array.map . Я посещал Mozilla и Tutorials Point, но они предоставили очень ограниченную информацию об этом.

Вот как я использую Array.map . Это немного сложно (немного d3.js вовлечено; просто игнорируйте его)

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

Я не совсем понимаю, что делает этот код. Я знаю, что он возвращает новый массив и прочее, но эта часть немного сложнее!

если вы хотите пройти через мой код: http://jsfiddle.net/ddfsb/2/

ОБНОВЛЕНИЕ 1

Я использую консоль, чтобы на самом деле понять, что происходит внутри кода. Глядя на предоставленные ответы, я четко понял концепцию array.map . Теперь единственной оставшейся частью являются параметры строк и столбцов, но есть разница между строкой и строками, а также столбцы и столбцы в предоставленной скрипте

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

Любая помощь??


Резюме

Array.map - это функция, которая находится в Array.prototype.map . Функция выполняет следующие действия:

  1. Создает новый массив с таким же количеством записей / элементов.
  2. Выполняет функцию обратного вызова, эта функция получает и текущий элемент массива в качестве аргумента и возвращает запись для нового массива.
  3. Возвращает вновь созданный массив.

Пример:

Основное использование:

const array = [1, 2, 3, 4];

// receive each element of array then multiply it times two
// map returns a new array
const map = array.map(x => x * 2);

console.log(map);

Функция обратного вызова также предоставляет индекс и исходный массив:

const array = [1, 2, 3, 4];

// the callback function can also receive the index and the 
// original array on which map was called upon
const map = array.map((x, index, array) => {
  console.log(index);
  console.log(array);
  return x + index;
});

console.log(map);


Вероятно, большинство людей, приходящих сюда (как и я), просто хотят базовый array.map использования array.map :

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]

Это самое основное. Дополнительные параметры можно найти по Array.map : Array.map


Понимание функции карты - это только часть решения, здесь также есть функция mapCell . Он принимает одну row параметров и возвращает что-то вроде:

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

Где значение ячейки зависит от row и столбца (стороны, звезды говорят и т. Д.)

Функция карты применяет преобразование к значению и возвращает это преобразованное значение.

Простой пример:

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

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

Так же:

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

Теперь, поскольку эта карта вложена с функцией, которая получает параметр row . Вы можете использовать его в функции карты, чтобы получить:

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

И это очень близко к вашему коду.


map просматривает ваш исходный массив и вызывает метод для каждого значения в массиве. Он собирает результаты вашей функции для создания нового массива с результатами. Вы «отображаете» массив значений в новый массив отображаемых значений. Ваш код эквивалентен:

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






array-map