JavaScript设计模式之原型模式

2024-02-19 20:40:44

原型模式在 JavaScript 中的实践

JavaScript 原型

JavaScript 作为一门基于原型的面向对象语言，其对象系统是由原型模式搭建而成的。原型模式是一种设计模式，允许你创建对象，而无需指定其类型。这意味着你可以轻松创建具有相似属性和行为的对象，无需为每个对象重复编写代码。

原型对象的创建和使用

在 JavaScript 中，每个函数都有一个原型对象，包含该函数相关的所有属性和方法。当你使用 new 创建对象时，该对象将继承原型对象的属性和方法。

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 person1 = new Person('John', 30);
const person2 = new Person('Jane', 25);

person1.greet(); // Hello, my name is John and I am 30 years old.
person2.greet(); // Hello, my name is Jane and I am 25 years old.

在这个示例中，Person 函数的原型对象包含 greet 方法。person1 和 person2 对象继承了 greet 方法，因此可以用来向用户打招呼。

原型的继承

JavaScript 对象可以通过原型继承来继承其他对象的属性和方法。

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

Student.prototype = Object.create(Person.prototype);
Student.prototype.constructor = Student;

const student1 = new Student('John', 30, 'Computer Science');
const student2 = new Student('Jane', 25, 'Business Administration');

student1.greet(); // Hello, my name is John and I am 30 years old.
student2.greet(); // Hello, my name is Jane and I am 25 years old.
student1.study(); // I am studying Computer Science.
student2.study(); // I am studying Business Administration.