简体   繁体   中英

How could I improve my use efficiency of object methods?

I am creating a small game. The game has a store and a bag; you can buy items from the store and put them in your bag. Each item does its own thing in the game, and there are two types of items: A) items that can only be triggered by an onclick and B) items that are supposed to constantly check for a condition, then run only once. I need help creating code for typeB items.

<body onload = "docReady()">
    <img src = "img1.png" onclick = "buy(item1TypeA)" />
    <img src = "img2.png" onclick = "buy(item2TypeA)" />
    <img src = "img3.png" onclick = "buy(item1TypeB)" />
    <img src = "img4.png" onclick = "buy(item2TypeB)" />
    // et cetera //
    <ul id = "bagContainer"> // LI items appended here // </ul>
</body>

function docReady() 
{
    item1 = { type:A, name:1, price:1000 };
    item2 = { type:A, name:2, price:2000 };
    item3 = { type:B, name:3, price:4000 };
    item4 = { type:B, name:4, price:16000 };
    // et cetera //
    money = 100000;
}

function buy(item)
{
    if (money >= item.price)
    {
        money -= item.price;
        if (sameItem == item1)
        {
            var listItem = document.createElement("li");
            listItem.textContent = sameItem.name;
            listItem.addEventListener('click', function() { //code1A// });
            document.getElementById("bagContainer").appendChild(listItem);
        }
        if (sameItem == item2)
        {
            var listItem = document.createElement("li");
            listItem.textContent = sameItem.name;
            listItem.addEventListener('click', function() { //code2A// });
            document.getElementById("bagContainer").appendChild(listItem);
        }
        // no idea how I could write the code for typeB items //
     }
}

The code for typeB items should constantly check for a condition. If the condition is met, the item should run its individual function. My problem is trying to do the constant checking; if I used while or if , how would I stop the code from constantly checking once its function is complete?

Also how could I soft code this?

You could create an interval which checks for a condition every x amount (milliseconds) and use removeInterval to remove it when the condition is met. To store the interval for the removing you could use an arrow function to stay in the same scope to give the function inside the interval access to interval .

if (sameItem == item3) {
  var listItem = document.createElement("li");
  listItem.textContent = sameItem.name;
  const interval = window.setInterval(() => {
    if (condition) {
      //code
      window.removeInterval(interval);
    }
  }, 1000); //or whatever frequency
  document.getElementById("bagContainer").appendChild(listItem);
}

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM