JavaScript：如何修复未正确分配属性值的实例答案

【问题标题】：JavaScript: How to fix an instance not being assigned property values properlyJavaScript：如何修复未正确分配属性值的实例
【发布时间】：2019-09-10 18:31:57
【问题描述】：

我创建了我的Piece 类的一个实例，并试图打印出该实例的quantity 的值，但我一直不确定。

我查看了 Google Chrome 控制台，console.log(temp) 很好，但在我看来，它似乎没有分配任何属性值。（我相信如果您单击实例的下拉箭头，它应该显示属性和值，对吗？）

我也有console.log(length) 和console.log(quantity)，它们打印得很好。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Parker Steel Program</title>
    <link rel="stylesheet" href="./main.css">
    <script src="./form.js"></script>
    <script src="./order.js"></script>
</head>
<body>
    <h1>Parker Steel Company</h1>
    <h2>New Order</h2>
    <form id="order-info">
        <label for="stock-length">Stock Length:</label>
        <input autofocus="true" id="stock-length" name="stock-length" required="true" type="number">
        <fieldset id="line1" name="line-1">
            <label for="line-1-length">Length: </label>
            <input id="line-1-length" name="line-1-length" required="true" type="number">
            <label for="line-1-quantity">Quantity: </label>
            <input id="line-1-quantity" name="line-1-quantity" required="true" type="number">
            <button onclick="removePurchaseLine('line1')" type="button">Remove</button>
        </fieldset>
        <button id="add-purchase-line" name="add-purchase-line" onclick="addPurchaseLine()" type="button">Add Purchase Line</button>
        <button onclick="getBestCuttingSequence()" type="button">Calculate</button>
    </form>
</body>
</html>

class Piece {
    constuctor(length, quantity) {
        this.length = length;
        this.quantity = quantity;
    }
}

function getBestCuttingSequence() {
    const stockLength = document.getElementById("stock-length").value;
    const pieces = getPieces();
}

function getPieces() {
    const pieces = []
    const numPurchaseLines = document.getElementsByTagName("fieldset").length; 

    for (let purchaseLine = 1; purchaseLine <= numPurchaseLines; purchaseLine++) {
        let length = document.getElementById(`line-${purchaseLine}-length`).value;
        let quantity = document.getElementById(`line-${purchaseLine}-quantity`).value;
        let temp = new Piece(length, quantity);
        console.log(temp.length);
    }

    return pieces;
}

最终，我会将这些实例推送到pieces 数组，然后再使用它们。

我的预期结果只是能够console.log(temp.quantity) 并让它打印值。

目前正在打印 undefined。

编辑：更改了属性名称。

【问题讨论】：

标签： javascript class oop object properties

【解决方案1】：

有一点错别字。 constuctor 缺少 r。改变它会起作用。

但是，您在不修改的情况下向this 添加属性，您可以传递对象，然后传递Object.assign

class Piece {
    constructor(obj) {
        Object.assign(this,obj);
    }
}

然后像这样通过

let temp = new Piece({length, quantity});

【讨论】：

我试过了，还是不行。抱歉，我忘了编辑这段代码的那部分。我将进行编辑。
我不敢相信我错过了。感谢您的帮助！