將數組傳遞給TypeScript中的構造函數

Question

我開始在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>

獎勵積分：告訴我一個更好的方法來跟蹤資源和成本！

Answer 1

您的問題不在打字稿中，而是在您的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
        };
    }
}

將數組傳遞給TypeScript中的構造函數

問題描述

1 個解決方案

解決方案1
3 已采納 2016-03-11 21:02:29

將數組傳遞給TypeScript中的構造函數

問題描述

1 個解決方案

解決方案1 3 已采納 2016-03-11 21:02:29

解決方案1
3 已采納 2016-03-11 21:02:29