未按預期向陣列添加javascript映射函數

Question

爲什麼'values'數組不包含'results'中每個項目的'Title'？

以下代碼輸出：1, 2, 3, 3, 3, 3而不是所需的：1, 2, 3, 1, 2, 3。

var results = [ 
 
    {Title: '1'}, 
 
    {Title: '2'}, 
 
    {Title: '3'}, 
 
]; 
 
var fields = { 
 
    Title: { Name:"Title", Required:true}, 
 
    Description: { Name:"Description", Required:false} 
 
}; 
 
var values = []; 
 
results.map(function(result, i){ 
 
    values[i] = fields; 
 
    Object.keys(result).map(function(key, index) { 
 
     values[i][key].Value = result[key]; 
 
    }); 
 
    console.log(values[i].Title.Value); 
 
}); 
 
values.map(function(value){console.log(value.Title.Value)});

Answer 1

地圖功能不會改變你與它的工作電流陣列返回一個新的改變了其數據，並要啓動值，你要推一個空數組新的價值。

Answer 2

var results = [ 
 
    {Title: '1'}, 
 
    {Title: '2'}, 
 
    {Title: '3'}, 
 
]; 
 
var fields = { 
 
    Title: { Name:"Title", Required:true}, 
 
    Description: { Name:"Description", Required:false} 
 
}; 
 
var values = []; 
 
values = results.map(function(result, i){ 
 
    values[i] = fields; 
 
    Object.keys(result).map(function(key, index) { 
 
     values[i][key].Value = result[key]; 
 
    }); 
 
    console.log(values[i].Title.Value); 
 
    });

的地圖（）方法創建要求每個數組元素的函數的結果的新的數組。

map（）方法按順序爲數組中的每個元素調用一次提供的函數。

注意：map（）不會爲沒有值的數組元素執行函數。

注意：map（）不會更改原始數組。

Answer 3

爲了簡單起見，您應該堅持使用reduce函數來減少和映射字段。

var rawData = [ 
 
    { Title: '1' }, 
 
    { Title: '2' }, 
 
    { Title: '3' }, 
 
] 
 
var fieldInfo = { 
 
    Title  : { Name:"Title",  Required: true }, 
 
    Description : { Name:"Description", Required: false } 
 
} 
 
var result = transformData(rawData, fieldInfo) 
 

 
console.log(JSON.stringify(result, null, 2)) 
 

 
result.forEach(item => console.log('Value: ', item.Title.Value)) 
 

 
function transformData(data, fields) { 
 
    return data.map((record, i) => { 
 
    return Object.keys(fields).reduce((result, key, index) => { 
 
     result[key] = { Value : record[key] || null }; 
 
     // -- Begin field cloning. 
 
     Object.keys(fields[key]).forEach(prop => result[key][prop] = fields[key][prop]); 
 
     // -- End field cloning. 
 
     return result 
 
    }, {}) 
 
    }) 
 
}

.as-console-wrapper { top: 0; max-height: 100% !important; }