Javascript 如何在对象中搜索属性中的属性？

我有一个目标：

key = {
    spawn:{type:1,img:app.assets.get('assets/spawn.svg')},
    wall:{type:2,img:app.assets.get('assets/wall.svg')},   
    grass:{type:3,img:app.assets.get('assets/grass.svg')},
    spike:{type:4,img:app.assets.get('assets/spike.svg')},
    ground:{type:5,img:app.assets.get('assets/ground.svg')}
  };

我有一个只包含类型的数组，我需要将给定的图像添加到其中，数组如下所示：

[{type:1,image:null},{type:3,image:null},{type:2,image:null},{type:2,image:null},{type:5,image:null}]

基本上我想循环数组，在key对象中找到类型，得到给定的图像并保存到数组中

有什么简单的方法可以做到这一点吗？

var key={
var key = {
    spawn:{type:1,img:app.assets.get('assets/spawn.svg')},
    wall:{type:2,img:app.assets.get('assets/wall.svg')},   
    grass:{type:3,img:app.assets.get('assets/grass.svg')},
    spike:{type:4,img:app.assets.get('assets/spike.svg')},
    ground:{type:5,img:app.assets.get('assets/ground.svg')}
  };
var typesArray = [{type:1,image:null},{type:3,image:null},{type:2,image:null},{type:2,image:null},{type:5,image:null}];

for(var i = 0, j = typesArray.length; i < j; i++)
{
    typesArray[i].image = getKeyObjectFromType(typesArray[i].type).img;
}

function getKeyObjectFromType(type)
{
    for(var k in key)
    {
        if(key[k].type == type)
        {
            return key[k];
        }
    }
    return {};
}

spawn:{type:1，img:app.assets.get（'assets/spawn.svg'）}，
wall:{type:2，img:app.assets.get（'assets/wall.svg'）}，
grass:{type:3，img:app.assets.get（'assets/grass.svg'）}，
spike:{type:4，img:app.assets.get（'assets/spike.svg'）}，
地面：{type:5，img:app.assets.get（'assets/ground.svg'）}
};
var typesArray=[{type:1，image:null}，{type:3，image:null}，{type:2，image:null}，{type:2，image:null}，{type:5，image:null}]；
对于（变量i=0，j=typesArray.length；i

用于（变量i=0；i

---

它循环遍历数组（“typesArray”），对于每个数组项，它遍历键中的所有对象，查找具有相同“type”的对象。当它找到它时，它将获取该键对象的“img”并保存到数组中。

给定键对象和如下所示的对象数组：

var key = {
    spawn:{type:1,img:app.assets.get('assets/spawn.svg')},
    wall:{type:2,img:app.assets.get('assets/wall.svg')},   
    grass:{type:3,img:app.assets.get('assets/grass.svg')},
    spike:{type:4,img:app.assets.get('assets/spike.svg')},
    ground:{type:5,img:app.assets.get('assets/ground.svg')}
};
var arr = [{type:1,image:null},{type:3,image:null},{type:2,image:null},{type:2,image:null},{type:5,image:null}];

我们可以首先在对象

键中创建一个属性数组，以简化迭代。
然后在数组
arr
上循环，在每个成员上，通过循环检查哪个图像根据其类型属于该成员（一些图像在第一个
true
上返回并结束循环）

如果希望循环没有副作用且不改变原始数组，则可以将
forEach
更改为a（并将返回的新数组指定给
arr
或新变量）

var keyTypes = Object.keys(key);
arr.forEach(function (item) {
    keyTypes.some(function (keyType) {
        if (key[keyType].type === item.type) {
            item.image = key[keyType].img;
            return true;
        }
        return false;
    });
});

更明智的做法是更改imagetypes的对象，以便您可以使用该类型作为访问属性，或者为此创建另一个对象（如另一个答案中所指出）。
我不确定此解决方案是否现代，但它不使用任何循环或递归

object = {
    spawn: {type:1, img:app.assets.get('assets/spawn.svg')},
    wall: {type:2, img:app.assets.get('assets/wall.svg')},   
    grass: {type:3, img:app.assets.get('assets/grass.svg')},
    spike: {type:4, img:app.assets.get('assets/spike.svg')},
    ground: {type:5, img:app.assets.get('assets/ground.svg')}
};
arr = [
    {type:1, image:null},
    {type:3, image:null},
    {type:2, image:null},
    {type:2, image:null},
    {type:5, image:null}
];

var typeImages = {};
Object.getOwnPropertyNames(object).forEach(function(value){
    typeImages[object[value].type] = object[value].img;
});
arr = arr.map(function(value){
    return {
        type: value.type,
        image: typeImages[value.type]
    };
});

使用lodash（）：

这将检查
初始列表
中的每个项目，在
键
中找到与其
类型
属性匹配的对象，并将其放入
图像
属性中

最终结果将出现在
updatedList
中，这里最突出的一点就是这行代码

…获取给定图像并将其保存到阵列中

我假设这意味着原始数组。我认为更好的方法是将适当的键和值映射到一个新数组，但我假设，对于这个例子，这是一个需求

为了使解决方案尽可能简洁，并满足对lodash解决方案的要求：

_.each(key, function(prop){
    _.each(_.filter(types, { type: prop.type }), function(type) { type.image = prop.img });
});

到目前为止，您尝试了什么代码？我们倾向于只对现有代码提供帮助，而不是为您编写所有代码。我现在不想把这些代码放在一起，但这是热情的人的一句好话。这实际上是一个很好的问题，值得投票，特别是如果它得到了一个好的答案（现有的答案不是现代Javascript）。“我很快就会悬赏的。”安迪的问题是，通常好的答案很难从猜测中找到。“代码尝试通常有助于澄清一个人实际上在尝试做什么，但我认为考虑到可编译的输入和输出，代码已经足够清晰了。”Andy说，这是出于需要研究工作的目的而提供的一些背景资料。我确实认为OP的表达构成了研究工作，而且不管它是否实现了研究工作的目的。您的评论“SO不是编码服务”似乎不相关。请添加一些解释，说明这是如何解决问题的。您可以详细地生成初始列表。总的来说，最好避免就地更新对象，或者让框架来处理，也就是说，做一些更固定的事情（我刚刚想到了这一点——我现在也在学习最佳实践）。享受达到1000个代表的乐趣：）
var key = {
    spawn:{type:1,img:app.assets.get('assets/spawn.svg')},
    wall:{type:2,img:app.assets.get('assets/wall.svg')},   
    grass:{type:3,img:app.assets.get('assets/grass.svg')},
    spike:{type:4,img:app.assets.get('assets/spike.svg')},
    ground:{type:5,img:app.assets.get('assets/ground.svg')}
};

var initialList = [{type:1,image:null},{type:3,image:null},{type:2,image:null},{type:2,image:null},{type:5,image:null}];

var updatedList = _.transform(initialList, function(result, item) {
    item.image = _.find(key, _.matchesProperty('type', item.type)).img;
    result.push(item);
});

_.each(key, function(prop){
    _.each(_.filter(types, { type: prop.type }), function(type) { type.image = prop.img });
});