JS定义类的六种方式详解

JavaScript 是一门面向对象的编程语言，定义类是面向对象编程中非常重要的部分。在JavaScript中，定义类的方式有六种。

方式一：函数定义类

使用函数定义类是最常见的方式之一。

function Person(name, age) {
  this.name = name;
  this.age = age;
}
Person.prototype.greet = function() {
  console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
}
const person = new Person('John', 30);
person.greet();

该方法定义了一个名为 Person 的类，该类具有名称、年龄等基本属性，以及一个自定义方法 greet。

通过使用 new 关键字创建一个名为 person 的具有给定初始化参数的新 Person 对象，并调用 greet 方法。

方式二：对象字面量定义类

使用对象字面定义类是另一种常见的方式。

const Person = {
  name: '',
  age: 0,
  greet() {
    console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
  },
  init(name, age) {
    this.name = name;
    this.age = age;
  },
};
const person = Object.create(Person);
person.init('John', 30);
person.greet();

这种方法使用对象字面量定义了一个类，名称为 Person，具有名称、年龄等基本属性， 以及两个自定义方法greet和init。

使用 Object.create() 创建一个名为 person 的新对象，并执行初始化方法 init 以设置属性，并调用 greet方法。

方式三：工厂函数

使用工厂函数定义类是通过函数返回对象的方式创建的，与前面的函数定义方式略有不同。

function createPerson(name, age) {
  function greet() {
    console.log(`Hello, my name is ${name} and I am ${age} years old.`);
  }
  return {
    name,
    age,
    greet
  };
}
const person = createPerson('John', 30);
person.greet();

使用该方法定义了一个名为 createPerson 的函数，该函数返回一个拥有名称、年龄和 greet 方法的新对象。

创建一个名为 person 并传入初始化参数，该对象具有 greet 方法，并调用该方法。

方式四：类定义

从 ES6 开始，JavaScript 支持使用 class 关键字定义类，该方式更接近传统语言中的定义方式，如 Java 和 C#。

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
  greet() {
    console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
  }
}
const person = new Person('John', 30);
person.greet();

使用该方式定义了一个名为 Person 的类，该类具有名称、年龄等基本属性，以及一个自定义方法 greet.

创建一个名为 person 的新 Person 对象，该对象已初始化并具有 greet 方法，并调用该方法。

方式五：继承类

继承是面向对象编程中非常重要的部分。从 ES6 开始，JavaScript 支持 extends 关键字，用以实现继承。

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
  greet() {
    console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
  }
}

class Employee extends Person {
  constructor(name, age, salary) {
    super(name, age);
    this.salary = salary;
  }
  getInfo() {
    console.log(`My name is ${this.name} and my salary is ${this.salary}.`);
  }
}

const employee = new Employee('Tom', 40, 5000);
employee.greet();
employee.getInfo();

该方法定义类 Employee，继承自 Person。同时新增了工资属性，并自定义了新的方法 getInfo。

创建一个名为employee的新 Employee 对象，并拥有父类 Person 的初始化值和子类 Employee 的工资值。

方式六：单例模式

单例模式是保证只存在一个类实例对象的模式。 JavaScript 中，在创建对象方面，可以使用函数闭包加上对象字面量的方式，实现单例定义类。

const Singleton = (function(){
  let instance;
  function Singleton() {
    if (!instance) {
      instance = this;
    }
    return instance;
  }
  return Singleton;
}());

const s1 = new Singleton();
const s2 = new Singleton();
console.log(s1==s2);

该方法使用闭包和对象字面量结合的方式，创建了一个名为 Singleton 的类。使用第一个 Singleton 实例。

创建了两个名为 s1 和 s2 的实例对象，两者相等，说明该方法实现了单例模式。

结论

以上就是 JavaScript 定义类的六种方式。学习并掌握这些方法，有助于你更好地理解面向对象编程，写出更加灵活的 JavaScript 代码。