![](/img/trans.png)
[英]Subclassing JavaScript arrays - constructor arguments not passing to array
[英]Passing arrays to a constructor in TypeScript
我开始在TypeScript中构建一个空闲游戏(比如cookie点击器 - 但更糟糕!)。 我是TypeScript的新手,也是JavaScript的新手。
当我从一个数字改变“成本”到“成本”类型时,问题出现了。 成本背后的想法是,一些后来的对象(如有翼的老鼠)将耗费多个资源,而不仅仅是废品。 我怀疑我的Cost实现在某处出错了,或者构造函数没有正确构建。 或者它没有正确实例化。
目前,当检查“resourceList [”rat“]。cost.costList [”scrap“]”时,它返回未定义。 这导致“老鼠”按钮永远保持禁用状态。
class Resource {
name: string;
amount : number;
cost: Cost;
value: number;
display() : string
{
if(this.amount - Math.floor(this.amount) > 0)
{
return this.amount.toFixed(2);
}
else
return this.amount.toString();
}
}
class Cost {
costList: { [id: string] : number; } = {};
constructor(res:string[], cost:number[]){
var i = 0;
for(var r in res)
{
var c = cost[i];
this.costList[r] = c;
i++;
}
return this;
}
}
class Scrap extends Resource {
constructor(public amount) {
super();
this.name = "scrap";
this.cost = new Cost([""],[0]);
document.getElementById('scrapLbl').innerHTML = this.name + ": ";
}
}
class Rat extends Resource {
constructor(public amount) {
super();
this.name = "rat";
this.cost = new Cost(["scrap"],[10]);
this.value = 1;
document.getElementById('ratLbl').innerHTML = this.name + ": ";
}
}
class wRat extends Resource {
constructor(public amount) {
super();
this.name = "wrat";
this.cost = new Cost(["scrap", "rat"],[10, 1]);
this.value = 1;
document.getElementById('wratLbl').innerHTML = this.name + ": ";
}
}
var resourceList: { [id: string] : Resource; } = {};
var curScrap = new Scrap(0);
var curRat = new Rat(0);
var curWRat = new wRat(0);
resourceList["scrap"] = curScrap;
resourceList["rat"] = curRat;
resourceList["wrat"] = curWRat;
function updateView()
{
document.getElementById('scrapId').innerHTML = resourceList["scrap"].display();
document.getElementById('ratId').innerHTML = resourceList["rat"].display();
if(resourceList["scrap"].amount >= resourceList["rat"].cost.costList["scrap"])
{
document.getElementById('scrapRat').disabled = false;
}
else
{
document.getElementById('scrapRat').disabled = true;
}
document.getElementById('ratId').title = resourceList["rat"].cost.toString();
}
function updateValues()
{
if(resourceList["rat"].amount > 0)
resourceList["scrap"].amount += (resourceList["rat"].value * resourceList["rat"].amount)/10;
}
function collectScrap()
{
resourceList["scrap"].amount += 1;
}
function scrapRat()
{
//cost
resourceList["scrap"].amount -= resourceList["rat"].cost.costList["scrap"];
//create
resourceList["rat"].amount += 1;
//update cost
resourceList["rat"].cost.costList["scrap"] *= 1.12;
}
window.setInterval(function(){
this.updateValues();
updateView();
}, 100);
不确定您是否需要HTML,但这里是:
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Scrap Clicker</title>
<link rel="stylesheet" href="css/bootstrap.min.css" media="screen">
<script src="js/jquery-2.2.1.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</head>
<body>
<label id="scrapLbl" ></label> <span id="scrapId">0</span>
<label id="ratLbl" ></label> <span id="ratId">0</span>
<label id="wratLbl" ></label> <span id="wratId">0</span>
<div>
<button title="Free" data-toggle="popover" data-trigger="hover" data-content="Dig!" class="btn btn-lg btn-primary" onclick="collectScrap()">collect scrap</button>
<button title="10 Scrap" data-toggle="popover" data-trigger="hover" data-content="Strap some scrap to a rat, now you've got a Scrap-Rat!" class="btn btn-lg btn-primary" onclick="scrapRat()" id="scrapRat" disabled>scrap rat</button>
<button title="10 Scrap, 1 rat" data-toggle="popover" data-trigger="hover" data-content="Strap some scrap to a Scrap-Rat, now you've got a Flying-Scrap-Rat!" class="btn btn-lg btn-primary" onclick="wRat()" id="wRat" disabled>Winged scrap rat</button>
</div>
<script src="game.js"></script>
<script>
$(document).ready(function(){
$('[data-toggle="popover"]').popover();
});
</script>
</body>
</html>
奖励积分:告诉我一个更好的方法来跟踪资源和成本!
您的问题不在打字稿中,而是在您的for..in
循环中:
let myArray = ["a", "b", "c"]
for (var item in myArray) {
console.log(item);
}
// 0,1,2
当在数组中使用for ... in循环时,“item”实际上是“索引”。 您希望Cost
类为:
class Cost {
costList: { [id: string] : number; } = {};
constructor(res:string[], cost:number[]){
for (let i = 0; i < res.length; i++) {
this.costList[res[i]] = cost[i];
}
}
}
编辑 :关于你的奖励积分,实现Cost
的更多打字稿方式是使用界面:
interface Cost {
[key: string]: number;
}
class Resource {
cost: Cost;
//...
}
class Rat extends Resource {
constructor(public amount) {
super();
this.cost = <Cost>{
"scrap": 0
};
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.