返回

理解class用法和get set的使用

前端

class 的用法

class 声明创建一个基于原型继承的具有给定名称的新类。你可以使用类表达式定义类,但是不同于类表达式,类声明不允许再次声明已经存在的类,否则将会抛出一个类型错误。

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

  get area() {
    return this.width * this.height;
  }

  set area(value) {
    this.width = Math.sqrt(value);
    this.height = Math.sqrt(value);
  }
}

在上面的代码中,我们定义了一个名为 Polygon 的类。这个类有一个构造函数,它接受两个参数:width 和 height。构造函数将这两个参数设置为类的属性。

Polygon 类还有一个名为 area 的访问器属性。这个属性允许我们以一种类似于属性的方式来访问和设置对象的面积。我们可以使用下面的代码来访问对象的面积:

const polygon = new Polygon(5, 10);
console.log(polygon.area); // 50

我们也可以使用下面的代码来设置对象的面积:

polygon.area = 100;
console.log(polygon.width); // 10
console.log(polygon.height); // 10

get 和 set 的使用

get 和 set 是两个访问器属性,它们允许我们以一种类似于属性的方式来访问和设置对象的属性。

get 访问器属性允许我们访问对象的属性。我们可以使用下面的代码来访问对象的属性:

const polygon = new Polygon(5, 10);
console.log(polygon.area); // 50

set 访问器属性允许我们设置对象的属性。我们可以使用下面的代码来设置对象的属性:

polygon.area = 100;
console.log(polygon.width); // 10
console.log(polygon.height); // 10

继承

继承允许我们创建新的类,这些类继承了另一个类的属性和方法。我们可以使用 extends 来实现继承。

class Square extends Polygon {
  constructor(side) {
    super(side, side);
  }
}

在上面的代码中,我们定义了一个名为 Square 的类。Square 类继承了 Polygon 类。这意味着 Square 类具有 Polygon 类的所有属性和方法。此外,Square 类还具有一个名为 side 的属性,这个属性是 Square 类特有的。

我们可以使用下面的代码来创建 Square 对象:

const square = new Square(5);
console.log(square.area); // 25

总结

class 是ES6中引入的一个重要特性,它允许我们使用更简洁、更面向对象的方式来编写 JavaScript 代码。get 和 set 是两个访问器属性,它们允许我们以一种类似于属性的方式来访问和设置对象的属性。继承允许我们创建新的类,这些类继承了另一个类的属性和方法。