原型模式就是将原型对象指向创建对象的类,使这些类共享原型对象的方法与属性。JS是基于原型链实现对象之间的继承,是对属性或者方法的共享,而不是对属性和方法的复制。

    // 图片轮播类
var LoopImages = function (imgArr, container) {
this.imagesArray = imgArr;
this.container = container;
}
LoopImages.prototype = {
// 创建轮播图片
createImage:function () {
console.log('LoopImages createImage function');
},
// 切换下一张图片
changeImage:function () {
console.log('LoopImages changeImage function');
}
}
// 上下滑动切换类
var SlideLoopImg = function (imgArr, container) {
// 构造函数继承图片轮播类
LoopImages.call(this,imgArr,container);
}
SlideLoopImg.prototype = new LoopImages();
// 重写继承的切换下一张图片方法
SlideLoopImg.prototype.changeImage = function () {
console.log('SlideLoopImg changeImage function')
}
// 渐隐切换类
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 changeImage function')
}
// 测试用例
console.log(fageImg.container); //slide
fadeImg.changeImg(); //FadeLoopImg changeImage function

原型模式 -- JavaScript语言的灵魂的更多相关文章

  1. 设计模式之原型模式——Java语言描述

    原型模式是用于创建重复对象,同时又能保证性能.这种类型的设计模式属于创建型模式,它提供了一种创建对象的方式 这种模式实现了一个原型接口,该接口用于创建当前对象的克隆.当直接创建对象的代价比较大时,则适 ...

  2. javascript创建对象的方法--原型模式

    javascript创建对象的方法--原型模式 一.总结 1.原型模式解决内存浪费的方法(继承):通过继承,对象继承原型模式下的所有属性,对象不同于其它对象的的属性自己创建或者修改 2.原型的使用(p ...

  3. Javascript原型模式总结梳理

    在大多数面向对象语言中,对象总是由类中实例化而来,类和对象的关系就像模具跟模件一样.Javascript中没有类的概念,就算ES6中引入的class也不过是一种语法糖,本质上还是利用原型实现.在原型编 ...

  4. 理解javascript中的原型模式

    一.为什么要用原型模式. 早期采用工厂模式或构造函数模式的缺点:  1.工厂模式:函数creatPerson根据接受的参数来构建一个包含所有必要信息的person对象,这个函数可以被无数次的调用,工厂 ...

  5. JavaScript之面向对象学习七(动态原型模式、寄生构造函数模式、稳妥构造函数模式创建自定义类型)

    一.动态原型模式 在面向对象学习六中的随笔中,了解到组合构造函数模式和原型模式创建的自定义类型可能最完善的!但是人无完人,代码亦是如此! 有其他oo语言经验的开发人员在看到独立的构造函数和原型时,很可 ...

  6. 面向对象的JavaScript --- 原型模式和基于原型继承的JavaScript对象系统

    面向对象的JavaScript --- 原型模式和基于原型继承的JavaScript对象系统 原型模式和基于原型继承的JavaScript对象系统 在 Brendan Eich 为 JavaScrip ...

  7. JavaScript之原型模式

    JavaScript中有这样的一个概念,对象. 有不少人觉得Java这么语言才是面向对象的语言,JavaScript哪里面向对象了. 其实说JavaScript面向对象还不如说JavaScript基于 ...

  8. Javascript设计模式之原型模式、发布订阅模式

    原型模式 原型模式用于在创建对象时,通过共享某个对象原型的属性和方法,从而达到提高性能.降低内存占用.代码复用的效果. 示例一 function Person(name) { this.name = ...

  9. [设计模式] JavaScript 之 原型模式 : Object.create 与 prototype

    原型模式说明 说明:使用原型实例来 拷贝 创建新的可定制的对象:新建的对象,不需要知道原对象创建的具体过程: 过程:Prototype => new ProtoExam => clone ...

随机推荐

  1. Sybase.在PowerDesigner中如何添加-约束

    Sybase.在PowerDesigner中如何添加-约束 资料 2010-06-23 08:57:09 阅读21 评论0   字号:大中小 订阅 唯一约束 唯一约束与创建唯一索引基本上是一回事,因为 ...

  2. cordova之旅之初识

    emmmm, 一直徘徊在移动端采用什么技术比较好,一直也没有找到,让我为了一个移动端而去学习一波react全家桶是不现实的操作,反观自己的技术栈,通过长时间的对比和剖析找到了入口点,不管了先会写再说吧 ...

  3. SCUT - 336 - 酋雷姆 - 最小生成树

    每个世界可以和别的世界连通,也可以直接联通虚拟的已经毁灭的世界,这样变成一个最小生成树问题. 但是好像哪里不对? 有人用dp过掉的? 不太清楚怎么搞的. 其实就是最小生成树-- #include< ...

  4. Insert into a Binary Search Tree

    Given the root node of a binary search tree (BST) and a value to be inserted into the tree, insert t ...

  5. U3D Shader基础

    http://blog.sina.com.cn/s/blog_471132920101dcnr.html 转载自风宇冲Unity3D教程学院 一个SubShader(渲染方案)是由一个个Pass块来执 ...

  6. 51nod 1831 小C的游戏

    小C和小L是好朋友,她们在玩一个游戏. 一开始有一个大小为n的石子堆,小C先手. 每次可以对这个石子堆拿走一个或者把这个石子堆分成等量的几份并只取其中一份(不能不变或只剩下一个). 如果取走最后一个人 ...

  7. angularJs 指令调用父controller某个方法

    1.父级controller:例如有个 init() 方法; 父级与子级的通信数据是$scope.controlFlag={}; 那么可以在父级controller里这样写:$scope.contro ...

  8. Jmeter跨线程组传参

      我们知道,同一线程组中可以通过“正则表达式提取器”获取其中一个取样器的响应结果中的参数,直接传给线程组中的其他取样器.但其他线程组中的取样器也想使用同样的参数时,无法直接获取.举个例子: 提取“登 ...

  9. CSS标签大全

    CSS常用标签 字体属性:(font) 大小:font-size: x-large;(特大) xx-small;(极小) 一般中文用不到,只要用数值就可以,单位:PX.PD 样式 :font-styl ...

  10. Python入门_汇总_未完待续

    if/elseif/else for while break continue 多重循环 list [] duple() dict {} set {[]} 函数 help(abs) 查看abs函数的帮 ...