原型模式

原型模式（Prototype Pattern）是用于创建重复的对象，同时又能保证性能。这种类型的设计模式属于创建型模式

原型模式是为了创建重复的对象，而使用new的方式、通过共享属性方法达到复制对象方式、这里和js的原型实现有点类似、但是js会有个问题就是共享的属性和方法是复制的引用地址、因为js灵活，导致如果某个属性或者方法被修改了、那么基于这个实例创建的对象都会被修改、所以一般其他语言使用该模式都是通过深拷贝的方式去实现原型模式～

走马灯案例

场景描述

轮播图效果、动画支持左右切换、上下切换、渐隐切换、缩放效果等等切换…那我们就可以通过原型模式把效果抽离出来、只需要维护一个基础类

class LoopImages{
        constructor(imgArr, container){
            this.imgArr = imgArr; // 轮播图片数据
            this.container = container; // 轮播图片容器
        }
        // 创建轮播图片
        createImage(){
        }
        // 切换下一张图片
        changeImage(){
            console.log('base changeImage')
        }
    }
    // 上下滑动
    class SlideLoopImg extends LoopImages{
        constructor(imgArr, container){
            super(imgArr, container)
        }
        // 重写切换效果
        changeImage(){
            console.log('SlideLoopImg changeImage')
        }
    }
    class FadeLoopImg extends LoopImages{
        constructor(imgArr, container){
            super(imgArr, container)
        }
        // 重写切换效果
        changeImage(){
            console.log('FadeLoopImg changeImage')
        }
    }
    let slideLoopImg = new SlideLoopImg([1,2,3],"#app")
    let fadeLoopImg = new FadeLoopImg([1,2,3],"#app")
    slideLoopImg.changeImage() // SlideLoopImg changeImage
    fadeLoopImg.changeImage() // FadeLoopImg changeImage

总结

优点

• 相比new性能要优异

  缺点

• 需要通过递归进行深拷贝