Question

我正在尝试为我的类命名，但是出现以下错误。如何为对象文字添加类？

Helpers = window.Helpers || {};
Helpers.Bootstrap = Helpers.Bootstrap || {};

Helpers.Bootstrap.Spinner = {
  class loader {

    constructor(element = '.spinner-border') {
      this.element = $(this)
    }

    show() {
      this.element.css("display", "block");

    }

    hide() {
      this.element.css("display", "none");
    }
  },
  class button {

    constructor(element = '.btn_spinner') {
      this.element  = $(this);
      this.html     = $(this).html();
    }

    show() {
      $(this).prop("disabled", true);
      $(this).html(
        `<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>Loading...`
      );
    }

    hide() {
      this.element.prop("disabled", false);
      this.element.html(this.html);
    }
  }
}

document.addEventListener("DOMContentLoaded", function(event) {   
  const SpinnerBtn = new Helpers.Bootstrap.spinner.button();
});

我在下面尝试简化问题。

Helpers = window.Helpers || {};
Helpers.Bootstrap = Helpers.Bootstrap || {};

Helpers.Bootstrap.Spinner = {
  Loader: class Loader {
     }
  },
  Button : class Button {
   }
}

document.addEventListener("DOMContentLoaded", function(event) {   
  const SpinnerBtn = new Helpers.Bootstrap.Spinner.Button();
});

错误：

SyntaxError：意外的标识符“加载程序”。预期后面有“：” 属性名称“类”。

Answer 1

您试图将两个字段添加到不带键的对象中

Helpers.Bootstrap.Spinner = {
    loader: class loader {...}
    button: class button {...}
}

Answer 2

Helpers.Bootstrap.Spinner = {
  class loader {

Helpers.Bootstrap.Spinner是一个对象。这就是{在第一行中的意思。

您不能将类定义放在对象内。解析器认为class是属性名称，因此其后应该有一个冒号。

我不知道您要做什么，因此我无法为您解决此问题，只是不这样做？另外，类名也应为Capitalized。

固定语法示例：

const Helpers = window.Helpers || {};
Helpers.Bootstrap = Helpers.Bootstrap || {};

Helpers.Bootstrap.Spinner = {
  Loader: class Loader {},
  Button: class Button {},
}

document.addEventListener("DOMContentLoaded", function(event) {
  const spinnerBtn = new Helpers.Bootstrap.Spinner.Button();
  console.log(spinnerBtn.constructor.name);
});

语法错误：意外的标识符“加载器”。属性名称“ class”后应有一个“：”

2 个答案: