class和普通构造函数有什么区别？

在前端开发，特别是 JavaScript 中，class 语法和传统的构造函数方法都可以用来创建对象，但它们之间有一些关键的区别：

1. 语法糖:

Class: class 语法是 ES6 引入的，本质上是构造函数的语法糖。它提供了一种更简洁、更面向对象的语法来定义对象蓝图。
构造函数: 传统的构造函数使用 function 关键字定义，并通过 new 关键字来创建对象实例。

2. 原型继承:

Class: 使用 class 定义的类，其原型继承关系更加清晰。通过 extends 关键字可以方便地实现继承，子类的原型会指向父类的原型。
构造函数: 使用构造函数实现继承需要手动操作原型链，例如将子类的原型指向父类的实例，并设置 constructor 属性。相对来说比较繁琐，容易出错。

3. 方法定义:

Class: 在 class 中定义方法更加简洁，不需要使用 prototype 属性。方法默认会被添加到类的原型上。
构造函数: 需要将方法显式地添加到构造函数的 prototype 属性上，才能被所有实例共享。

4. this 绑定:

Class: 类方法中的 this 默认绑定到类的实例，除非显式修改。箭头函数除外，箭头函数的 this 绑定取决于其定义时的上下文。
构造函数: 在构造函数中，this 指向新创建的实例。但在构造函数的普通方法中，this 的绑定取决于调用方式。如果方法被直接调用，this 会指向全局对象（浏览器中是 window，Node.js 中是 global）。

5. 静态方法:

Class: 使用 static 关键字可以定义静态方法，静态方法属于类本身，而不是类的实例。
构造函数: 可以通过将方法直接添加到构造函数本身上来模拟静态方法，但不如 class 语法清晰。

6. super 关键字:

Class: 在子类中，可以使用 super 关键字来调用父类的方法或构造函数，方便实现继承和扩展。
构造函数: 在构造函数中，需要通过 Parent.call(this, ...) 的方式来调用父类的构造函数。

7. new.target:

Class: 支持 new.target，可以检测构造函数是否通过 new 关键字调用。
构造函数: 也支持 new.target。

示例：

构造函数:

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

Person.prototype.greet = function() {
  console.log("Hello, my name is " + this.name);
};

let person = new Person("Alice");
person.greet(); // Output: Hello, my name is Alice

Class:

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

  greet() {
    console.log("Hello, my name is " + this.name);
  }
}

let person = new Person("Bob");
person.greet(); // Output: Hello, my name is Bob