Question

我是基于OOP的JavaScript的新手。出于测试目的，我创建了以下代码段。我创建了四个按钮，点击每个按钮它将具有不同的功能。当我第一次单击任何按钮时，它会给出预测结果。在第二次单击任何按钮时，它给出了以下错误：

classFunction = new classFunction();

我使用的代码如下：

<html>
  <head>
    <script type="text/javascript">
      var classFunction;

      function classFunction() {
        this.publicVariable = 'Public Varibale';
        var privateVariable = 'Private Variable';

        this.publicMethod = function () {
          alert('Public Method');
        }

        function privateMethod() {
          alert('private Method');
        }

        return this;
      }

      function privateVariable() {
        classFunction = new classFunction();
        alert(classFunction.privateVariable);
      }

      function publicvariable() {
        classFunction = new classFunction();
        alert(classFunction.publicVariable);
      }

      function privateFunction() {
        classFunction = new classFunction();
        classFunction.privateMethod();
      }

      function publicFunction() {
        classFunction = new classFunction();
        classFunction.publicMethod();
      }
    </script>
  </head>

  <body>
    <input type="button" value="Private Variable" onclick="privateVariable()" />
    <input type="button" value="Public Variable" onclick="publicvariable()" />
    <input type="button" value="Private Function" onclick="privateFunction()" />
    <input type="button" value="Public Function" onclick="publicFunction()" />
  </body>
</html>

是否有任何理由让新操作员第二次不工作？

Answer 1

您通过重用名称classFunction作为变量名来覆盖构造函数。规范是JS用于大写构造函数，如：ClassFunction，这可能会有所帮助。

Answer 2

原因是因为您的变量名称和构造函数名称相同。因此，第一次创建新实例并将其分配给变量时，类将被实例覆盖。

确保以不同的方式命名以下内容。

var classFunction; 
function classFunction()

Javascript新运算符

2 个答案: