<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>new+call(this)组合应用再探讨实例</title>
    <script type="text/javascript">
    /***
    *参数：
    *imgArr:图片组
    *container:轮播图的父容器
    *arrow:左右箭头图片组
    */
    //创建图片轮播基类
    var LoopImages = function(imgArr,container){
        this.imagesArr = imgArr;
        this.container = container;
    }
    LoopImages.prototype = {
        //创建轮播图片
        createImage:function(){
            console.log('createLoopImages');
        },
        //切换下一张图片
        changeImage:function(){
            console.log('changeLoopImages');
        }
    }
    //创建上下滑动子类
    var SlideLoopImg = function(imgArr,container){
        //构造函数继承父类图片轮播类
        LoopImages.call(this,imgArr,container);
    }
    SlideLoopImg.prototype = new LoopImages();//这句加上上面的call(this)就是组合式继承了
    //先new继承父类原型，再创建子类的原型方法，这个顺序一定得这样写，否则报错
    SlideLoopImg.prototype.changeImage = function(){
        console.log('SlideLoopImg changeImages');
    }
    //创建渐隐渐显子类
    var FadeLoopImg = function(imgArr,container,arrow){
        LoopImages.call(this,imgArr,container);
        this.arrow = arrow;
    }
    FadeLoopImg.prototype = new LoopImages();
    FadeLoopImg.prototype.changeImage = function(){
        console.log('FadeLoopImg changeImages');
    }

//测试用例
    var fadeimg = new FadeLoopImg(['01.jpg','02.jpg','03.jpg','04.jpg'],'slide',['left.jpg','right.jpg']);//'slide'是父容器名字
    fadeimg.changeImage();

//本例已经通过验证
    </script>
</head>
<body>
    
</body>
</html>

js原生设计模式——7原型模式之new+call(this)组合应用再探讨实例的更多相关文章

  1. js原生设计模式——7原型模式之真正的原型模式——对象复制封装

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  2. js原生设计模式——13桥接模式(相同业务逻辑抽象化处理的职责链模式)

    桥接模式之多元化类之间的实例化调用实例 <!DOCTYPE html><html lang="en"><head>    <meta ch ...

  3. js原生设计模式——9外观模式封装

    1.事件处理程序兼容性封装 <!DOCTYPE html><html lang="en"><head>    <meta charset= ...

  4. js原生设计模式——9外观模式封装2(小型代码库YJ)

    <script type="text/javascript">    //小型代码库YJ封装    var YJ = {        //根据id获取元素       ...

  5. 设计模式_11_原型模式（prototype）深拷贝、浅拷贝

    设计模式_11_原型模式(prototype) 浅拷贝: package designPatternOf23; /** * 定义:用原型实例,指定创建对象的种类,并通过拷贝这些原型创建新的对象 * P ...

  6. C#设计模式(6)——原型模式（Prototype Pattern）

    一.引言 在软件系统中,当创建一个类的实例的过程很昂贵或很复杂,并且我们需要创建多个这样类的实例时,如果我们用new操作符去创建这样的类实例,这未免会增加创建类的复杂度和耗费更多的内存空间,因为这样在 ...

  7. 乐在其中设计模式(C#) - 原型模式(Prototype Pattern)

    原文:乐在其中设计模式(C#) - 原型模式(Prototype Pattern) [索引页][源码下载] 乐在其中设计模式(C#) - 原型模式(Prototype Pattern) 作者:weba ...

  8. C#设计模式之六原型模式（Prototype）【创建型】

    一.引言 在开始今天的文章之前先说明一点,欢迎大家来指正.很多人说原型设计模式会节省机器内存,他们说是拷贝出来的对象,这些对象其实都是原型的复制,不会使用内存.我认为这是不对的,因为拷贝出来的每一个对 ...

  9. C#设计模式之五原型模式（Prototype Pattern）【创建型】

    一.引言 在开始今天的文章之前先说明一点,欢迎大家来指正.很多人说原型设计模式会节省机器内存,他们说是拷贝出来的对象,这些对象其实都是原型的复制,不会使用内存.我认为这是不对的,因为拷贝出来的每一个对 ...

随机推荐

  1. Android程序两种退出的方法

    两种程序退出的方法: Context的finish()方法: android.os.Process的killProcess()方法:(当程序isRegistered()失败,说明程序被修改过,调用ki ...

  2. java调用dll-JNA

    介绍 给大家介绍一个最新的访问本机代码的 Java 框架 —JNA . JNA(Java Native Access) 框架是一个开源的 Java 框架,是 SUN 公司主导开发的,建立在经典的 JN ...

  3. Python3基础 函数 关键字参数 的示例

    镇场诗: 诚听如来语,顿舍世间名与利.愿做地藏徒,广演是经阎浮提. 愿尽吾所学,成就一良心博客.愿诸后来人,重现智慧清净体.-------------------------------------- ...

  4. unity3d 多人寻路堵塞堆叠问题

    使用unity提供的NavMeshAgent寻路,当有多个agent一起寻路时总会出现堵塞堆叠的问题. 本人使用了一个非常粗劣简单的方案解决此问题,当然跟魔兽的寻路完全没得比,但保证有比较好的性能,且 ...

  5. HTML知识点

    1. 首页布局 // 顶部DIV#top{ position:absolute; top:; left:; width:100%; height:15%; overflow:hidden; margi ...

  6. 省市区三级联动插件：app-jquery-cityselect.js

    (function ($) { $.fn.cityselect = function (options) { var settings = $.extend ({}, options); this.e ...

  7. boost库之shared_ptr

    shared_ptr 编辑 目录 1简介 2作用 3历史 4概要 5用法 ▪ 删除共享对象 ▪ 标准容器 1简介编辑 shared_ptr是一种智能指针(smart pointer). 2作用编辑 s ...

  8. create schema 与create database的区别

    概论第四版中增加了create schema (第三版好像没有这个内容),但是却没有提到create  database.相反目前在大多数DBMS中(如SQL Server2000.Mysql等)都有 ...

  9. Struts1、2种如何防止表单重复提交和两者的区别

    使用token指令牌就行了.在进入标签之前的action中通过saveToken方法保存指令牌.在表单提交后的action中判断这个token是否存在,如果存在允许插入,并通过resetToken把t ...

  10. iOS常用宏定义

    转发:https://www.douban.com/note/486674206/ #ifndef MacroDefinition_h#define MacroDefinition_h //----- ...