资讯专栏INFORMATION COLUMN

设计模式——原型模式

wapeyang / 914人阅读

摘要:原型模式示例描述用原型实例指向创建对象的类使用于创建新的对象的类共享原型对象的属性及方法当然是基于原型链实现对象之间的继承这种继承是基于一种对属性或者方法的共享而不是对属性和方法的复制案例假设页面中有很多焦点图具有不同的切换效果有上下切换左

原型模式 示例 描述

用原型实例指向创建对象的类, 使用于创建新的对象的类共享原型对象的属性及方法. 当然javascript是基于原型链实现对象之间的继承,
这种继承是基于一种对属性或者方法的共享, 而不是对属性和方法的复制.

案例

假设页面中有很多焦点图, 具有不同的切换效果, 有上下切换, 左右切换, 渐隐渐现.

实现
// 图片轮播类
var LoopImages = function(imgArr, container) {
    this.imagesArray = imgArr;            // 轮播图片数组
    this.container = container;            // 轮播图片容器
};

LoopImages.prototype = {
    createImage: function() {            // 创建轮播图片

    },
    changeImage: function() {            // 切换下一张图片

    }
};

// 上下滑动切换类
var SlideLoopImg = function(imgArr, container) {
    // 构造函数继承
    LoopImages.call(this, imgArr, container);
};

SlideLoopImg.prototype = new LoopImages();
// 重写继承的切换下一张图片
SlideLoopImg.prototype.changeImage = function() {};

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/80139.html

相关文章

  • 理解JavaScript的核心知识点:原型

    摘要:首先,需要来理清一些基础的计算机编程概念编程哲学与设计模式计算机编程理念源自于对现实抽象的哲学思考,面向对象编程是其一种思维方式,与它并驾齐驱的是另外两种思路过程式和函数式编程。 JavaScript 中的原型机制一直以来都被众多开发者(包括本人)低估甚至忽视了,这是因为绝大多数人没有想要深刻理解这个机制的内涵,以及越来越多的开发者缺乏计算机编程相关的基础知识。对于这样的开发者来说 J...

    iKcamp 评论0 收藏0
  • JS函数的工厂模式、构造函数模式原型模式的区别

    摘要:于是就有了构造函数和原型模式混合模式组合使用构造函数模式和原型模式创建自定义类型最常见的方式,就是组合模式。 创建对象 JS有六种数据数据类型,其中五种属于基本数据类型:Null、Boolean、undefined、String、Number。而其它值都是对象。数组是对象,函数是对象,正则表达式是对象。对象也是对象。 来看一下对象的定义: 无序属性的集合,其属性可以包含基本值、对象、或...

    william 评论0 收藏0
  • 理解js对象

    摘要:将构造函数的作用域赋值给新对象因此指向了新对象执行构造函数的代码为这个新对象添加属性返回对象最初是用来标识对象类型的。但提到检测对象类型,还是使用将构造函数当作函数构造函数与其他函数唯一区别。 创建对象 虽然Object构造函数与对象字面量都能创建单个对象, 但这些方式都有明显的缺点: 使用同一个接口创建很多对象, 会产生大量重复代码。 var obj = {}; //对象字面量 va...

    zhouzhou 评论0 收藏0
  • JS 原型模式

    摘要:你可以使用像下面这样的代码为上面的例子来实现车辆模具是福特总结原型模式在里的使用简直是无处不在,其它很多模式有很多也是基于的,这里大家要注意的依然是浅拷贝和深拷贝的问题,免得出现引用问题。 1. 简介 原型模式(Prototype pattern),用原型实例指向创建对象的类,使用于创建新的对象的类的共享原型的属性与方法。 2. 实现 对于原型模式,我们可以利用JavaScript特有...

    Coding01 评论0 收藏0
  • 读《javaScript高级程序设计-第6章》之封装类

    摘要:创建构造函数后,其原型对象默认只会取得属性至于其他的方法都是从继承来的。上图展示了构造函数的原型对象和现有的两个实例之间的关系。所有原生的引用类型都在其构造函数的原型上定义了方法。 第6章我一共写了3篇总结,下面是相关链接:读《javaScript高级程序设计-第6章》之理解对象读《javaScript高级程序设计-第6章》之继承 工厂模式 所谓的工厂模式就是,把创建具体对象的过程抽象...

    seal_de 评论0 收藏0
  • JavaScript面向对象的程序设计

    摘要:目录导语理解对象和面向对象的程序设计创建对象的方式的继承机制原型对象原型链与原型对象相关的方法小结导语前面的系列文章,基本把的核心知识点的基本语法标准库等章节讲解完本章开始进入核心知识点的高级部分面向对象的程序设计,这一部分的内容将会对对象 目录 导语 1.理解对象和面向对象的程序设计 2.创建对象的方式 3.JavaScript的继承机制 3.1 原型对象 3.2 原型链 3.3 与...

    gitmilk 评论0 收藏0

发表评论

0条评论

wapeyang

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<