TypeScript | 设计模式02 - 原型模式

665 阅读2分钟

小知识,大挑战!本文正在参与“程序员必备小知识”创作活动。

原型模式

用一个已经创建的实例为原型,通过复制该原型实例来创建一个和原型相同或类似的新对象。简单说,通过克隆对象来实现一个新的对象。

直接查看一下的demo:

interface CarProto {
  clone(): CarProto;
}
​
class Bus implements CarProto {
  public name: string;
  public from: string;
  public createYear: number;
​
  constructor() {
    this.name = "公交车1";
    this.from = "北京";
    this.createYear = 2001;
  }
​
  public toWhere(where: string) {
    return `${this.name}${this.from} 开往 ${where}`;
  }
  // 实现复制
  public clone(): CarProto {
    return Object.create(this);
  }
}
​
const bus1 = new Bus();
console.log(bus1.toWhere("天津"));
bus1.name = "公交车2";
const bus2 = Object.create(bus1);
console.log(bus2.toWhere("天津"));
console.log(bus1.toWhere("天津"));
​
// 输出结果
公交车1 从 北京 开往 天津
公交车2 从 北京 开往 天津
公交车2 从 北京 开往 天津

通过Object.create的方法创建新的对象,提高了效率,但是从结果输出来看,需要对已有的类进行修改,原始的对象也发生了变化,整个过程就违背了OCP(开闭原则)原则。

适用场景:

  1. 对象间相同或者相似,没有太大的差别,即仅部分属性不同
  2. 当创建的对象成本比较大,如初始化时间长,占用网络资源过大
  3. 当创建的对象需要比较多的前置条件
  4. 系统中大量使用该类对象,且都需要对该对象的属性重新赋值

javaScript的原型和原型链

再聊聊JavaScript的原型和原型链,因JavaScript是基于原型的面向对象编程语言。

  • 原型(prototype):每个对象都包含一个原型属性,用于关联另一个对象,关联后就能使用那个对象的属性和方法

    • new创建的对象时,其实是 构造函数.constructor =原型
    • 大部分都具有原型,都继承自Object.prototype的原型
    • null、Object.prototype没有原型对象
  • 原型链:对象之间通过原型关联起来,形成一个原型链