Javascript 基于对象属性的布尔变量

我完全被一些可能非常基本的东西所困扰：

我正在使用构造函数创建几个游戏项：

function itemCreator(itemName, itemType, itemPosition) {
            this.itemName = itemName;
            this.itemType = itemType;
            this.itemPosition =itemPosition;
}

 new itemCreator('shootUp001', 'item_up', 108 );

 new itemCreator('shootLeft001', 'item_left', 608);

 new itemCreator('shootLeft002', 'item_left', 40);

稍后，我将为以下项目分配图像：

function assignImages(item){
    itemObject =item;
    itemType = itemObject.itemType;
    var itemDiv = document.getElementById(itemType); //get the div that has the name of this item
    itemDiv.innerHTML = '<img src="' +itemType +'.png"/><span class="x">x</span><span id="' +itemType +'SpanCount"></span>' //put the picture of this item in there and also a span for the counting
}

功能分配图像（项目）{
itemObject=项目；
itemType=itemObject.itemType；
var itemDiv=document.getElementById（itemType）；//获取具有此项名称的div
itemDiv.innerHTML='x'//将此项目的图片放在其中，并为计数设置一个范围
}

这就是我被困的地方：

当我第一次插入某个itemType的图像时，如何创建一个设置为“true”的布尔变量？我需要这个，以避免插入相同类型的图像两次

我知道我可以做一个简单的dom查找，但我正在尝试学习javascript，希望了解在这种情况下如何避免这种情况

---

那么，根据itemType创建变量并在assignImage传递具有匹配itemType的对象时修改该变量的智能方法是什么呢？

我将您的类itemType重命名为Item，只是为了遵循标准Javascript约定，在该约定中，我们用大写字母开始命名类。下面是我如何使用一个简单的字典来跟踪已经创建的项目类型：

var images = {};//keeping track of images by item types so far

function assignImages(item){
    var type = item.itemType
    if(!images.hasOwnProperty(type)) {
        var itemDiv = document.getElementById(type); //get the div that has the name of this item
        itemDiv.innerHTML = '<img src="' +type +'.png"/><span class="x">x</span><span id="' +type +'SpanCount"></span>' //put the picture of this item in there and also a span for the counting
        images[type] = itemDiv;
    } else {
        console.warn("A image of item type %s already exists", type);
    }
}

var-images={}//到目前为止，按项目类型跟踪图像
功能分配图像（项目）{
变量类型=item.itemType
如果（！images.hasOwnProperty（类型））{
var itemDiv=document.getElementById（type）；//获取具有此项名称的div
itemDiv.innerHTML='x'//将此项目的图片放在其中，并为计数设置一个范围
images[type]=itemDiv；
}否则{
console.warn（“项目类型%s的映像已存在”，类型）；
}
}

我将您的类itemType重命名为Item，只是为了遵循标准Javascript约定，即我们用大写字母开始命名类。下面是我如何使用一个简单的字典来跟踪已经创建的项目类型：

var images = {};//keeping track of images by item types so far

function assignImages(item){
    var type = item.itemType
    if(!images.hasOwnProperty(type)) {
        var itemDiv = document.getElementById(type); //get the div that has the name of this item
        itemDiv.innerHTML = '<img src="' +type +'.png"/><span class="x">x</span><span id="' +type +'SpanCount"></span>' //put the picture of this item in there and also a span for the counting
        images[type] = itemDiv;
    } else {
        console.warn("A image of item type %s already exists", type);
    }
}

var-images={}//到目前为止，按项目类型跟踪图像
功能分配图像（项目）{
变量类型=item.itemType
如果（！images.hasOwnProperty（类型））{
var itemDiv=document.getElementById（type）；//获取具有此项名称的div
itemDiv.innerHTML='x'//将此项目的图片放在其中，并为计数设置一个范围
images[type]=itemDiv；
}否则{
console.warn（“项目类型%s的映像已存在”，类型）；
}
}

不应将图像分配给项目，而应将图像分配给类型。 获取所有唯一的项目类型，然后将图像分配给这些类型

function itemCreator(itemName, itemType, itemPosition) {
            this.itemName = itemName;
            this.itemType = itemType;
            this.itemPosition =itemPosition;
}

function assignImages(itemType){
    var itemDiv = document.getElementById(itemType);
    itemDiv.innerHTML = '<img src="' +itemType +'.png"/><span class="x">x</span><span id="' +itemType +'SpanCount"></span>'
}

var list = [
    new itemCreator('shootUp001', 'item_up', 108),
    new itemCreator('shootLeft001', 'item_left', 608),
    new itemCreator('shootLeft002', 'item_left', 40)
];

var unique_types = list.map(function(i) {
        return i.itemType;
    }).reduce(function(p, c) {
        if (p.indexOf(c) < 0) p.push(c);
        return p;
    }, []);

unique_types.forEach(function(itemType){
    assignImages(itemType);
});

函数itemCreator（itemName、itemType、itemPosition）{
this.itemName=itemName；
this.itemType=itemType；
this.itemPosition=itemPosition；
}
函数赋值图像（itemType）{
var itemDiv=document.getElementById（itemType）；
itemDiv.innerHTML='x'
}
变量列表=[
新项目创建者（'shootUp001'，'item_up'，108），
新项目创建者（'shootLeft001'，'item_left'，608），
新项目创建者（'shootLeft002'，'item_left'，40）
];
var unique_types=list.map（函数（i）{
返回i.itemType；
}).减少（功能（p，c）{
如果（p.indexOf（c）<0）p.push（c）；
返回p；
}, []);
唯一的\u类型。forEach（函数（itemType）{
分配图像（项目类型）；
});

不应将图像分配给项目，而应将图像分配给类型。 获取所有唯一的项目类型，然后将图像分配给这些类型

function itemCreator(itemName, itemType, itemPosition) {
            this.itemName = itemName;
            this.itemType = itemType;
            this.itemPosition =itemPosition;
}

function assignImages(itemType){
    var itemDiv = document.getElementById(itemType);
    itemDiv.innerHTML = '<img src="' +itemType +'.png"/><span class="x">x</span><span id="' +itemType +'SpanCount"></span>'
}

var list = [
    new itemCreator('shootUp001', 'item_up', 108),
    new itemCreator('shootLeft001', 'item_left', 608),
    new itemCreator('shootLeft002', 'item_left', 40)
];

var unique_types = list.map(function(i) {
        return i.itemType;
    }).reduce(function(p, c) {
        if (p.indexOf(c) < 0) p.push(c);
        return p;
    }, []);

unique_types.forEach(function(itemType){
    assignImages(itemType);
});

函数itemCreator（itemName、itemType、itemPosition）{
this.itemName=itemName；
this.itemType=itemType；
this.itemPosition=itemPosition；
}
函数赋值图像（itemType）{
var itemDiv=document.getElementById（itemType）；
itemDiv.innerHTML='x'
}
变量列表=[
新项目创建者（'shootUp001'，'item_up'，108），
新项目创建者（'shootLeft001'，'item_left'，608），
新项目创建者（'shootLeft002'，'item_left'，40）
];
var unique_types=list.map（函数（i）{
返回i.itemType；
}).减少（功能（p，c）{
如果（p.indexOf（c）<0）p.push（c）；
返回p；
}, []);
唯一的\u类型。forEach（函数（itemType）{
分配图像（项目类型）；
});

我看不到您在Item类的第5行实际修改

items

？@Pavlo的位置-我正在将Item实例分配给items中的itemType。问题是：如果我正确阅读了您的代码，则只有当不存在具有相同itemType的项时，您才会创建属性。但是我需要所有的项目，不管它们是否具有相同的项目类型。我只需要为每个itemType分配一次图像。我想可能。。我仍在努力理解这一部分：images[type]=itemDiv；是否将image-dom元素放入images变量？我们真的需要存储这么多数据吗？您存储的是对DOM元素的引用，

images

images只引用了一堆指针，实际上并没有保存那么多数据。您可以存储一个布尔值，但是如果您以后想对某个item类型的元素进行操作，那么保存DOM元素可能会很有用。我看不出您在item类的第5行实际修改

items

？@Pavlo的位置-我正在将item实例分配给items中的itemType。问题是：如果我读取了您的代码正确地说，仅当不存在具有相同itemType的项时，才创建属性。但是我需要所有的项目，不管它们是否具有相同的项目类型。我只需要为每个itemType分配一次图像。我想可能。。我仍在努力理解这一部分：images[type]=itemDiv；是否将image-dom元素放入images变量？我们真的需要存储这么多数据吗？您存储的是对DOM元素的引用，

images

images只引用了一堆指针，实际上并不存在