如何在对象内部映射和排列

Question

所以这里我有一个要映射的对象：

var bakery = {
        "items":
        {
            "item":[
                 {
                     "id": "0001",
                     "type": "donut",
                     "name": "Cake",
                     "ppu": 0.55,
                     "batters": {
                         "batter":[
                             { "id": "1001", "type": "Regular" },
                             { "id": "1002", "type": "Chocolate" },
                             { "id": "1003", "type": "Blueberry" },
                             { "id": "1004", "type": "Devil's Food" }
                         ]
                     },
                     "topping":[
                         { "id": "5001", "type": "None" },
                         { "id": "5002", "type": "Glazed" },
                         { "id": "5005", "type": "Sugar" },
                         { "id": "5007", "type": "Powdered Sugar" },
                         { "id": "5006", "type": "Chocolate with Sprinkles" },
                         { "id": "5003", "type": "Chocolate" },
                         { "id": "5004", "type": "Maple" }
                      ]
                 },
                 ...
                 ...
                 ...
            ]
        }
}

这是目标结果

var target = [{
        "id": 1, //as an int
        "type": "donut",
        "name": "Cake",
        "ppu": 0.55,
        "batters": "all of the batter types as a string",
        "ingredients": [],//a copy of all the toppings
        "countOfFillings": 0
}];

这是我的映射函数

//  creates variable bakeryArray that contains the actual Array inside of Baker var
var bakeryArray = bakery.items.item

//  newCakes var invoked map function with the bakeryArray
var newCakes = bakeryArray.map(mapCakes)

function mapCakes(oldCakes) {
    let batter = oldCakes.batters.batter
    console.log(batter, "batter Logged")
    var newCakesObject = {
        type: oldCakes.type,
        name: oldCakes.name,
        ppu: oldCakes.ppu,
        batters: batter.type,
        ingredients: "ingridients",
        countOfFillings: "total number of ingrediensts"
    };
    return newCakesObject;
};

我运行遇到了从旧对象获取 Batter、Ingredients 和 countOfFillings 到新对象的问题。

为了让击球手进入 newCakesObject，我唯一能想到的就是我必须为击球手创建另一个映射函数（我在下面尝试过）？然后在击球手下的 mapCakes 函数中调用它？但是每次我为此创建另一个函数时，我都会收到一条错误消息，指出在控制台

中调用 newBatterArray 后它是未定义的

var newBatterArray = bakeryArray.map(mapBatters)
function mapBatters(oldarray) {
    let theBatters = oldarray.batters.batter
    console.log(theBatters.type, "we ran")
    var newBatters = {
        type: theBatters.type
    }
    return newBatters;
}

Answer 1

为了更清楚地解释您的 bakery 对象，我对其进行了一些调整

var bakery = {
    "items":[
        {
          "id": "0001",
          "type": "donut",
          "name": "Cake",
          "ppu": 0.55,
          "batters":[
            { "id": "1001", "type": "Regular" },
            { "id": "1002", "type": "Chocolate" },
            { "id": "1003", "type": "Blueberry" },
            { "id": "1004", "type": "Devil's Food" }
          ],
          "toppings":[
            { "id": "5001", "type": "None" },
            { "id": "5002", "type": "Glazed" },
            { "id": "5005", "type": "Sugar" },
            { "id": "5007", "type": "Powdered Sugar" },
            { "id": "5006", "type": "Chocolate with Sprinkles" },
            { "id": "5003", "type": "Chocolate" },
            { "id": "5004", "type": "Maple" }
          ]
        },
        {
          "id": "0002",
          "type": "donut",
          "name": "Cake",
          "ppu": 0.65,
          "batters":[
            { "id": "1001", "type": "Regular1" },
            { "id": "1002", "type": "Chocolate1" },
            { "id": "1003", "type": "Blueberry1" },
            { "id": "1004", "type": "Devil's Food1" }
          ],
          "toppings":[
            { "id": "5001", "type": "None1" },
            { "id": "5002", "type": "Glazed1" },
            { "id": "5005", "type": "Sugar1" },
            { "id": "5007", "type": "Powdered Sugar1" },
            { "id": "5006", "type": "Chocolate with Sprinkles1" },
            { "id": "5003", "type": "Chocolate1" },
            { "id": "5004", "type": "Maple1" }
          ]
        },
        ...
        ...
        ...
        ...
    ]
}

现在您可以遍历每个项目并构建您的 target 数组，如下所示

var target = [];

// define reducer function for each item in bakery.items
const reduceToTarget = item => {
    var obj = {};
    obj.id = item.id;
    obj.type = item.type;
    obj.name = item.name;
    obj.ppu = item.ppu;
    obj.batters = '';
    item.batters.forEach(b => obj.batters+=b.type+'|');
    obj.ingredients = item.toppings;
    target.push(obj);
}

// Now you can call the reduceToTarget function to get the desired target list/array
bakery.items.forEach(reduceToTarget);

输出看起来像这样

target = [
  {
    id: "0001"
    type: "donut"
    name: "Cake"
    ppu: 0.55
    batters: "Regular|Chocolate|Blueberry|Devil's Food|",
    ingredients : [/* list of ingredients*/]
  },
  {
    id: "0002"
    type: "donut"
    name: "Cake"
    ppu: 0.65
    batters: "Regular|Chocolate|Blueberry|Devil's Food|",
    ingredients : [/* list of ingredients*/]
  }
]

注意：

要获得 countOfFillings，您只需在 ingredients 列表中为 target

中的任何元素调用 length() 函数

如何在对象内部映射和排列

how to map and array inside of an object

arrays

javascript-objects

map-function

注意：