企业🤖AI智能体构建引擎,智能编排和调试,一键部署,支持私有化部署方案 广告
ES6 class只不过是现有的基于原型继承机制的一层语法糖,了解这个事实之后,`class`关键字对你来说就不再像一个其它语言的概念了。 ``` class Box { constructor(length, width) { this.length = length; this.width = width; } calculateArea() { return this.length * this.width; } let box = new Box(2, 2); box.calculateArea(); // 4 // ES5 function Box(length, width) { this.length = length; this.width = width; } Box.prototype.calculateArea = function() { return this.length * this.width; } var box = new Box(2, 2); box.calculateArea(); // 4 ``` 另外,ES6中还可以用`extends`关键字来创建子类。 ``` class MyComponent extends React.Component { // Now MyComponent class contains all React component methods // such as componentDidMount(), render() and etc. } ``` #### 构造方法 ~~~ constructor([arguments]) { ... } ~~~ 在一个类中只能有一个名为 “constructor” 的特殊方法。 一个类中出现多次构造函数 (`constructor)`方法将会抛出一个SyntaxError错误。 在一个构造方法中可以使用`super`关键字来调用一个父类的构造方法。 如果没有显式指定构造方法,则会添加默认的 constructor 方法。 如果不指定一个构造函数(constructor)方法, 则使用一个默认的构造函数(constructor)。 ~~~js class Square extends Polygon { constructor(length) { // 在这里, 它调用了父类的构造函数, 并将 lengths 提供给 Polygon 的"width"和"height" super(length, length); // 注意: 在派生类中, 必须先调用 super() 才能使用 "this"。 // 忽略这个,将会导致一个引用错误。 this.name = 'Square'; } get area() { return this.height * this.width; } set area(value) { // 注意:不可使用 this.area = value // 否则会导致循环call setter方法导致爆栈 this._area = value; } } ~~~