堆栈内存溢出
  繁体   English   中英

如何更改JavaScript的初始值

[英]How can I change the initial value on JavaScript

 原文  2018-08-25 14:35:05  8   4    javascript

问题描述

例如，当我单击“减号”单选按钮并输入值1000时，初始值为10,000。初始值将变为9000。单击“添加”单选按钮并输入值的初始值为9000。 2000当前初始值9000 + 2000等于11,000。

问题是将initialValue返回到其原始值10,000。 

 //external script function Compute(initialNum, numOne) { this._initialNum = initialNum; this._numOne = numOne; this.addNum = function() { alert(this._initialNum = this._initialNum + this._numOne); return this._initialNum; }; this.minusNum = function() { alert(this._initialNum = this._initialNum - this._numOne); return this._initialNum; }; } //body script var rdoAdd = document.getElementById("rdoAdd"); var rdoMinus = document.getElementById("rdoMinus"); var tblResult = document.getElementById("tblResult"); function printResult() { var initialValue = 10000, deposit = 0, withdraws = 0; var rdoAdd = document.getElementById("rdoAdd"); var rdoMinus = document.getElementById("rdoMinus"); var numOne = parseInt(document.getElementById('txtNumOne').value); var objAccount = new Compute(initialValue, numOne); if (rdoAdd.checked) { deposit += objAccount.addNum(); display = "<tr>"; display += "<td>" + deposit + "</td>"; display += "<tr>"; tblResult.innerHTML += display; resetx(); } else { withdraws += objAccount.minusNum(); display = "<tr>"; display += "<td>" + withdraws + "</td>"; display += "<tr>"; tblResult.innerHTML += display; resetx(); } } function resetx() { document.getElementById('txtNumOne').value = ""; document.getElementById("rdoAdd").checked = false; document.getElementById("rdoMinus").checked = false; } 
 <input type="radio" id="rdoAdd" name="rdo" required>Add<br><br> <input type="radio" id="rdoMinus" name="rdo" reuired>Minus<br><br> <input type="text" id="txtNumOne"><br><br> <!-- Withdraw<br><br> <input type="text" id="txtNumTwo"> --> <button onclick="printResult()">Compute</button><br><br> <table border="1px"> <th>Result</th> <tbody id = "tblResult"> </tbody> </table>

4 个解决方案

解决方案1
 0  2018-08-25 14:37:01

随便走 

 var initialValue = 10000;
 var objAccount = new Compute(initialValue);

在printResult函数之外。

解决方案2
 0  2018-08-25 14:48:36

这只是与范围相关的问题。 如果在函数内部使用var ，它将在局部范围内重新声明或创建initialValue的新实例。

如果要更改变量initialValue的值，请不要使用var 。 这只会更改全局范围内定义的变量...

这是可行的，因为JavaScript解释器首先检查本地范围内是否存在给定变量的实例。 如果没有，它将检查全局范围内变量的存在。

编辑：

根据您的问题，您希望initialValue的值在每次计算后都保持initialValue 。 为了实现这一点，您必须首先在printResult()函数外部的全局范围内声明对象objAccount ； 因为在代码中，每次调用printValue()时，都会创建一个新的Compute实例（ objAccount ）。 其次，您应该从Compute类中删除numOne属性，并将numOne作为参数传递给addNum()和minusNum() 。

您可以将Compute的方法修改为： 

this.addNum = function(_numOne) {
    ...
}

this.minusNum = function(_numOne) {
    ...
}

在调用方法时， 

objAccount.addNum(<some_number>);

和 

objAccount.minusNum(<some_number>);

在此之后，您甚至都不需要使用deposit或withdraws ... 

if (rdoAdd.checked) {
    objAccount.minusNum(numOne);    // This will directly adjust `initialValue`
    display = "<tr>";
    display += "<td>" + objAccount._initialNum + "</td>";
    display += "<tr>";
    tblResult.innerHTML += display;

    resetx();
}

同样，对else语句执行相同的操作...

奖励：您似乎使用的是ES5样式，而是使用ES6 （包括class和let这样的关键字：类似于var ）

这是一个片段（使用ES6 classes ） 

 <!DOCTYPE html> <html> <head> <title></title> </head> <body> <input type="radio" id="rdoAdd" name="rdo" required>Add<br><br> <input type="radio" id="rdoMinus" name="rdo" reuired>Minus<br><br> <input type="text" id="txtNumOne"><br><br> <button onclick="printResult()">Compute</button><br><br> <table border="1px"> <th>Result</th> <tbody id = "tblResult"> </tbody> </table> <script src = "java.js"></script> <script> class Compute { constructor(initialNum) { this._initialNum = initialNum; } addNum(_numOne) { alert(this._initialNum += _numOne); return this._initialNum; }; minusNum(_numOne) { alert(this._initialNum -= _numOne); return this._initialNum; }; } var rdoAdd = document.getElementById("rdoAdd"); var rdoMinus = document.getElementById("rdoMinus"); var tblResult = document.getElementById("tblResult"); var initialValue = 10000; var objAccount = new Compute(initialValue); function printResult() { var display = ""; var rdoAdd = document.getElementById("rdoAdd"); var rdoMinus = document.getElementById("rdoMinus"); var numOne = parseInt(document.getElementById('txtNumOne').value); if (rdoAdd.checked) { objAccount.addNum(numOne); // This will directly adjust `initialValue` display = "<tr>"; display += "<td>" + objAccount._initialNum + "</td>"; display += "<tr>"; tblResult.innerHTML += display; resetx(); } else { objAccount.minusNum(numOne); // This will directly adjust `initialValue` display = "<tr>"; display += "<td>" + objAccount._initialNum + "</td>"; display += "<tr>"; tblResult.innerHTML += display; resetx(); } } function resetx() { document.getElementById('txtNumOne').value = ""; document.getElementById("rdoAdd").checked = false; document.getElementById("rdoMinus").checked = false; } </script> </body> </html>

解决方案3
 0  2018-08-26 10:14:23

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
    <input type="radio" id="rdoAdd" name="rdo" required>Add<br><br>
    <input type="radio" id="rdoMinus" name="rdo" reuired>Minus<br><br>
    <input type="text" id="txtNumOne"><br><br>

    <button onclick="printResult()">Compute</button><br><br>

    <table border="1px">
    <th>Result</th>

    <tbody id = "tblResult">

    </tbody>
    </table>
<script src = "java.js"></script>
<script>
    var rdoAdd = document.getElementById("rdoAdd");
    var rdoMinus = document.getElementById("rdoMinus");
    var tblResult = document.getElementById("tblResult");
    var initialValue = 10000;
    var objAccount = new Compute(initialValue);

function printResult() {
    var display = "";
    var rdoAdd = document.getElementById("rdoAdd");
    var rdoMinus = document.getElementById("rdoMinus");
    var numOne = parseInt(document.getElementById('txtNumOne').value);

    if (rdoAdd.checked) {
    objAccount.addNum(numOne);    // This will directly adjust `initialValue`
    display = "<tr>";
    display += "<td>" + objAccount._initialValue + "</td>";
    display += "<tr>";
    tblResult.innerHTML += display;

    resetx();
    } else {
    objAccount.minusNum(numOne);    // This will directly adjust `initialValue`
    display = "<tr>";
    display += "<td>" + objAccount._initialValue + "</td>";
    display += "<tr>";
    tblResult.innerHTML += display;

    resetx();
    }
}
function resetx() {
    document.getElementById('txtNumOne').value = "";
    document.getElementById("rdoAdd").checked = false;
    document.getElementById("rdoMinus").checked = false;
}

</script>
</body>
</html>

解决方案4
 0  2018-08-26 15:15:31

function Compute(initialNum) {
    this._initialNum = initialNum;

    this.addNum = function(numOne) {
        alert(this._initialNum = this._initialNum + numOne);
        return this._initialNum;
    };

    this.minusNum = function(numOne) {
        alert(this._initialNum = this._initialNum - numOne);
        return this._initialNum;
    };
}

暂无
暂无

声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 如何更改JavaScript中的值？ 虽然我更改了标签的文本，但它仍返回初始值，但如何解决？ 如何为表单中的文本字段设置初始值？ 此值是从javascript函数生成的。 没有botton的情况下如何定义事件？ React - 如何根据道具更改多个初始状态 如何通过Javascript更改文本框中的PHP值 如何使用JavaScript更改style属性中的一个值？ 如何从JavaScript更改XML元素值？ 如何一起使用HTML和Javascript来更改变量值？ 如何在 javascript 的循环中更改对象的项目值？ 如何根据对象值更改javascript中的颜色
相关标签
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM