简述ES6 的 class 和构造函数的区别 ?

ES6的class是JavaScript中实现面向对象编程的新语法糖,它的背后仍然是基于原型的继承。class提供了更清晰、更简单的语法来创建对象和处理继承。而在ES6之前,我们通常使用构造函数来创建对象和实现继承。

以下是关于class和构造函数的一些主要区别:

  1. 语法:class的语法更简洁、更直观。构造函数的语法相对较复杂,特别是在处理继承时,需要使用prototype属性和new关键字。

  2. 继承:在class中,我们使用extends关键字来实现继承,而在构造函数中,我们需要手动操作prototype来实现继承。

  3. 方法定义:在class中,我们可以直接在类的内部定义方法,而在构造函数中,我们需要在prototype对象上添加方法。

  4. 严格模式:class总是在严格模式下运行,而构造函数则不是。

  5. 可见性:class中的所有方法都是可枚举的,而构造函数的方法则不是。

以下是两者的使用示例:

使用构造函数:

function Person(name, age) {
  this.name = name;
  this.age = age;
}

Person.prototype.sayHello = function() {
  console.log('Hello, I am ' + this.name);
}

var person = new Person('Tom', 20);
person.sayHello(); // 输出:Hello, I am Tom

使用class

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  sayHello() {
    console.log(`Hello, I am ${this.name}`);
  }
}

let person = new Person('Tom', 20);
person.sayHello(); // 输出:Hello, I am Tom

总的来说,class相比于构造函数,提供了更简洁、更直观的语法,使得代码更易于理解和维护。

发表评论

后才能评论