原型设计模式
定义
- 一种创建对象的设计模式，它允许通过复制现有对象来生成新对象，而无需依赖具体类的构造函数。
- 在该模式中，一个原型对象作为基础，当需要创建新对象时，通过复制该原型对象并进行适当的修改来生成新的对象实例。
核心概念
- 在原型设计模式中，核心概念是原型对象 和克隆方法。
- 原型对象是要被复制的对象，它必须实现一个克隆方法，该方法能够返回一个与自身相似的新对象。
- 通过调用克隆方法，可以生成一个新的对象，并根据需要进一步的修改。
关于拷贝
原型设计模式可以通过浅拷贝 或深拷贝来实现对象的复制。
- 浅拷贝只复制对象的基本属性值，而对于引用类型的属性，则仍然是共享的。
- 深拷贝则会递归地复制所有对象及其引用的对象，从而完全独立地创建一个新的对象。
示例
typescript
// 定义原型对象接口
interface Prototype {
// 原型对象必须实现一个clone方法，用来返回一个与自身相似的新对象
// 注意clone方法的返回值的类型是Prototype
clone(): Prototype;
}
// 具体的原型对象实现类
class ConcretePrototype implements Prototype {
// 私有属性，复制之后的对象应该和元对象具有相同的私有属性
private property: string;
constructor(property: string) {
this.property = property;
}
public clone(): Prototype {
// 创建一个新的对象并复制当前对象的属性值
const clonedObj = new ConcretePrototype(this.property);
return clonedObj;
}
public getProperty(): string {
return this.property;
}
}
// 使用原型对象的客户端代码
const originalObj = new ConcretePrototype("Original Property");
// 克隆对象
const clonedObj = originalObj.clone();
// 克隆对象的应该和源对象具有相同的属性
console.log(originalObj.getProperty()); // 输出：Original Property
console.log(clonedObj.getProperty()); // 输出：Original Property
// 在克隆之后，可以对细节进行修改
originalObj.property = "Modified Property";
console.log(originalObj.getProperty()); // 输出：Modified Property
console.log(clonedObj.getProperty()); // 输出：Original Property应用场景
- 当一个对象的创建过程很昂贵或复杂 时，可以使用原型模式来避免重复执行这些过程。
- 当需要创建多个相似对象时，可以使用原型模式来节省时间和资源。
- 当一个对象需要有多个可变状态组合时，可以使用原型模式来方便地生成不同状态的对象。
- 原型链 ：JavaScript 中的每个对象都有一个原型（prototype）属性，它指向另一个对象。通过原型链，在查找对象的属性和方法时，可以逐级向上访问原型对象，实现属性和方法的继承关系。
- Object.create() 方法 ：该方法可以用于创建一个新对象，并将一个现有对象设置为新对象的原型。这样，新对象就可以继承原型对象的属性和方法。
- DOM 操作 ：在浏览器环境中，通过 DOM 操作创建、复制或修改元素是常见的使用原型模式的例子。例如，可以使用
cloneNode()方法来克隆一个 DOM 元素节点，从而生成具有相同属性和子节点的新元素。