JS的构造函数和ES6的类是JS中很重要的概念，也是面向对象编程的核心。在本文中，我们将探讨JS的构造函数和ES6的类的基础知识，包括它们的定义、使用方法以及它们之间的区别。
JS的构造函数
JS中的构造函数是一种特殊的函数，用于创建对象。它们是通过使用new关键字调用的函数，并且在函数内部使用this关键字来引用新创建的对象。构造函数可以包含属性和方法，这些属性和方法可以在创建对象时被调用。
以下是一个简单的JS构造函数的例子：
function Person(name, age) {
this.name = name;
this.age = age;
this.sayHello = function() {
console.log("Hello, my name is " + this.name + " and I am " + this.age + " years old.");
}
}
var person1 = new Person("John", 30);
person1.sayHello(); // 输出：Hello, my name is John and I am 30 years old.
// 原型上添加方法
Person.prototype.getName = function() {
return this.name
}
在上面的例子中，我们定义了一个名为Person的构造函数，并将其用于创建一个名为person1的新对象。我们传递了两个参数，即name和age，这些参数用于设置person1对象的属性。此外，我们还定义了一个名为sayHello的方法，该方法将输出一个问候语，其中包括person1对象的名称和年龄。
ES6的类
ES6引入了类的概念，这是一种更简洁、更易于阅读和理解的面向对象编程方式。类是一种特殊的函数，用于创建对象。与构造函数不同，类的定义中包含了构造函数以及其他方法和属性的定义。
以下是一个简单的ES6类的例子：
class Person {
// 使用constructor定义构造函数
constructor(name, age) {
this.name = name;
this.age = age;
}
// 实例原型上的方法
sayHello() {
console.log("Hello, my name is " + this.name + " and I am " + this.age + " years old.");
}
}
var person1 = new Person("John", 30);
person1.sayHello(); // 输出：Hello, my name is John and I am 30 years old.
在上面的例子中，我们定义了一个名为Person的类，其中包含了一个构造函数和一个名为sayHello的方法。与构造函数不同，我们在类定义中使用constructor关键字来定义构造函数。我们还定义了一个名为sayHello的方法，该方法与构造函数中定义的方法相同。
类的私有属性
类的私有属性是指只能在类内部访问的属性，外部无法访问或修改。 在ES6之前，JS中没有原生支持类私有属性的概念，但是可以通过一些特定技巧方式来模拟实现私有属性。而在ES6中，我们可以使用类的#符号来定义私有属性，在类的内部访问私有属性时，需要在属性名前加上#符号。
class Person {
#age;
constructor(name, age) {
this.name = name;
this.#age = age;
}
getName() {
return this.name;
}
}
let person1 = new Person("John", 30);
console.log(person1.getName()); // 输出：John
console.log(person1.#age); // 抛出私有属性错误
类的静态属性
类自身的属性和方法（类本身相关的数据或常量信息），不会出现在实例上。在ES6中，我们可以使用static关键字来定义静态属性。
另外如果静态方法包含 this 关键字，这个 this 指的是类，而不是实例。static声明的静态属性和方法都不可以被子类继承。
class Person {
static species = "human";
constructor(name, age) {
this.name = name;
this.age = age;
}
sayHello() {
console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
}
static getSpecies() {
return `The species of human is ${Person.species}.`;
}
}
let person1 = new Person("John", 30);
person1.sayHello(); // 输出：Hello, my name is John and I am 30 years old.
console.log(Person.species); // 输出：human
console.log(Person.getSpecies()); // 输出：The species of human is human.
console.log(person1.getSpecies()) // Uncaught TypeError: person1.getSpecies is not a function
JS的构造函数和ES6的类之间的区别
JS的构造函数和ES6的类之间有几个重要的区别。以下是一些最重要的区别：
-
语法：构造函数使用函数声明的方式来定义，而类使用class关键字来定义。
-
继承：类支持更简单和更灵活的继承方式，同时也支持多重继承。构造函数也可以实现继承，但是需要使用原型链来实现。
-
可读性：类的语法更加易于阅读和理解，因为它使用了更加自然的面向对象编程方式。
-
实例化：构造函数需要使用new关键字来创建新的实例，而类可以直接调用构造函数来创建新的实例。
总结
JS的构造函数和ES6的类都是JS中非常重要的概念，它们都用于创建对象和实现面向对象的编程。构造函数和类之间有很多相似之处，但也有一些重要的区别。理解这些基础知识对于成为一名优秀的前端开发人员非常重要。
