如何在控制台中重新定义JavaScript(非CSS)类？

Question

我是JS类的新手,我主要做的是后端工作.

我正在玩新的JS类,所以我开始在这里看一些例子:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes

我去了chrome(铬)开发人员工具控制台,我编写了Polygon类:

class Polygon {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }
}

然后我想重新定义类,根据包含方法的示例,所以我写道:

class Polygon {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }

  get area() {
    return this.calcArea();
  }

  calcArea() {
    return this.height * this.width;
  }
}

这引发了一个错误: Uncaught SyntaxError: Identifier 'Polygon' has already been declared(…)

现在我明白ES6中有一个新的范围,并且类会自动使用新的范围等等......但实际上,我如何重新定义我的类？:d

我经常写Python,所以我习惯于重新定义我想要的东西.

Answer 1

块范围声明(let,const,class)不能被重新声明.

类表达式,var可用于在控制台中重用和重新声明变量:

var Polygon = class Polygon  { ... };
new Polygon();
var Polygon = class Polygon  { ... };
new Polygon();

Answer 2

在不更改原始代码的情况下，没有一个答案提供了解决方案。因此，这里提供了完善的解决方案。

如果在代码中有这样的内容：

class Polygon {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }
}

然后，这意味着您已经创建了一个let名为的变量Polygon。您不能重新声明Polygon，但是可以重新分配它。

因此，如果您需要在JS控制台中进行实验，请执行以下操作：

Polygon = class {
  //... new stuff here
}

这将替代原始类，但不会违反let限制。

您可以通过将上述代码粘贴到控制台中来进行尝试，然后尝试new Polygon(1,2)。