原型模式就是将原型对象指向创建对象的类,使这些类共享原型对象的方法与属性。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. 获得HttpWebResponse请求的详细错误内容

    try { } catch (WebException ex) { HttpWebResponse response = (HttpWebResponse)ex.Response; Console.W ...

  2. 327. Count of Range Sum(inplace_marge)

    Given an integer array nums, return the number of range sums that lie in [lower, upper] inclusive.Ra ...

  3. AcEdCommandStack 输出所有命令

    ; AcEdCommandIterator* iter = nullptr; for (iter = acedRegCmds->iterator(); !iter->done(); ite ...

  4. MySQL下载与安装配置

    一.Windows 上安装 MySQL Windows 上安装 MySQL 相对简单,最新版本下载地址: 官网:https://dev.mysql.com/downloads/mysql/ 下载步骤: ...

  5. BZOJ 1069: [SCOI2007]最大土地面积(旋转卡壳)

    题目链接~ 1069: [SCOI2007]最大土地面积 思路很简单,极角排序求完凸包后,在凸包上枚举对角线,然后两边分别来两个点旋转卡壳一下,搞定! 不过计算几何的题目就是这样,程序中间的处理还是比 ...

  6. Centos下磁盘管理的常用命令记录(如查找大文件)

    Centos下磁盘管理的常用命令记录 查看系统磁盘空间占用,使用命令: df -h 结果: 查看磁盘inode使用情况,如果inode用完了,磁盘就没法写入新的内容了: df -i 结果: 如何查找磁 ...

  7. 【Sass初级】嵌套选择器规则

    在CSS中,我们都知道所有代码都在一个“根级别”的选择器中,每个CSS的样式声明都写嵌套的话,那意客味需要写很多的代码. 今天我要带领大家进入到Sass的最基本原则中.这就是所谓的“基础规则(Ince ...

  8. js一些练习题

    1 如果数组中存在 item,则返回元素在数组中的位置,否则返回 -1 function indexOf(arr, item) { if(Array.prototype.indexOf){ retur ...

  9. CodeForces - 508B-Anton and currency you all know

    Berland, 2016. The exchange rate of currency you all know against the burle has increased so much th ...

  10. hdu6062RXD and logic gates多校题 构造

    听说标算的点数是2^(n+1)级别的,也不知道我是不是比标算优一点? (话说这种题一眼看过去怎么跟题答一样) 然而并不是题答,没法手玩,来考虑一下一般解法: 考虑一个规模较小的问题:最后一位一定是0 ...