1  var bgAuido={
 2     audio : pingfan.$$('audio'),
 3     audioBtn : pingfan.$$('audioBtn'),
 4     init : function(){
 5           var _this=this;
 6           window.addEventListener(touchStart,function(){
 7                 _this.audio.play();
 8                 window.removeEventListener(touchStart,arguments.callee) 9       },false);
10           this.audioBtn.addEventListener(touchStart,function(){
11               if(_this.audioBtn.className.replace(/(^\s+)|(\s+$)/g,'')=='off'){
12                    _this.audio.play();
13                     _this.audioBtn.className='';
14               }else if(_this.audioBtn.className==''){
15                     _this.audio.pause();
16                     _this.audioBtn.className='off';
17               }
18           },false)
19
20     }
21 }
22
23 bgAuido.init();            

属性与方法,都通过自变量定义给对象,然后通过init()方法整体驱动,但是不方便继承,与赋值更改属性(由于属性值没有预留参数,所以,只能单个更改)。下面的方法可以很方便继承和赋予参数

 1 function BgAuido(opt){
 2         opt=opt || {};
 3         this.audio = pingfan.$$('audio'),
 4         this.audioBtn = pingfan.$$('audioBtn'),
 5         this.width=opt.width || 400;
 6 }
 7 BgAuido.prototype={
 8         say:function(){
 9                 alert(this.width);
10         },
11         init : function(){
12                 var _this=this;
13                 window.addEventListener(touchStart,function(){
14                         _this.audio.play();
15                         window.removeEventListener(touchStart,arguments.callee)
16                 },false);
17                 this.audioBtn.addEventListener(touchStart,function(){
18                         if(_this.audioBtn.className.replace(/(^\s+)|(\s+$)/g,'')=='off'){
19                                 _this.audio.play();
20                                 _this.audioBtn.className='';
21                         }else if(_this.audioBtn.className==''){
22                                 _this.audio.pause();
23                                 _this.audioBtn.className='off';
24                         }
25                 },false)
26
27         }
28 }

转载于:https://www.cnblogs.com/cdwp8/p/4088446.html

javascript开发中的封装模式(转)相关推荐

  1. 前端开发中的MCRV模式

    针对前端开发中基于ajax的复杂页面开发所面临的代码规模大,难以组织和维护,代码复用性.扩展性和适应性差等问题,本文尝试以MVC思想为基础,结合Web前端开发中内容-结构-表现-行为相分离的开发标准, ...

  2. 浅谈开发中的MVVM模式及与MVP和MVC的区别

    2019独角兽企业重金招聘Python工程师标准>>> 我记得前段时间分享了一篇文章< 浅谈Andorid开发中的MVP模式>(点击可跳转),反响不错,为了进一步介绍MV ...

  3. 全方位地介绍JavaScript开发中的各个主题《JavaScript编程全解》(好书分享更新中)

    JavaScript编程全解 作者: [日]井上诚一郎 / [日]土江拓郎 / [日]滨边将太 出版社: 人民邮电出版社 译者: 陈筱烟 内容简介  · · · · · · 本书全方位地介绍了Java ...

  4. 游戏开发中的策略模式

    游戏开发中的策略模式 博主公司今年的新项目是一个重度养成中度策略的塔防游戏(参考国外的random dice),虽然最后项目算是垮了吧(一测的留存实在太低),但是还是需要总结一下代码(总结才会进步). ...

  5. HTML5开发中使用MVC模式

    公司上周举办了一次编程马拉松,时间为两天,我当然用了lufylegend.js,为了让代码看起来更整洁一些,尝试着用javascript写了一个小的MVC框架,并开发了一个简单的demo,由于时间太短 ...

  6. JavaScript面向对象中的严格模式

    概述 严格模式是什么 严格模式是JavaScript中的一种限制性更强的变种方式.严格模式不是一个子集:它在语义上与正常代码有着明显的差异. 不支持严格模式的浏览器与支持严格模式的浏览器行为上也不一样 ...

  7. mvvm模式和mvc的区别_Android 开发中的架构模式 -- MVC / MVP / MVVM

    预备知识 了解 Android 基本开发 看完本文可以达到什么程度 了解如何分析一个架构模式 掌握 MVC,MVP,MVVM 架构定义和实现 更多面试内容,面试专题,flutter视频 全套,音视频从 ...

  8. 前端JavaScript开发中需要注意的代码问题

    在我们进行前端开发的过程中,需要遵循一定的代码编写规则,这样才能够让我们写出更合理的.易于阅读和维护的代码,那么你知道在JavaScript中有哪些需要注意的地方吗? 一.块级作用域let 取代 va ...

  9. MIS开发中C/S模式与B/S模式的结合策略

    原文url:http://www.ahetc.gov.cn/cit/199910/03.htm 感觉十分不错,两天后再补充自己的观点 一.引言 Intranet这个名字自Internet商业化以来,已 ...

  10. JSP开发中的分层模式

    分层模式: 1.分层模式是最常见的一种架构模式. 2.分层模式是其他模式的基础. **目的:**业务处理代码与JSP代码混在一起,不易阅读,不易代码维护. **方式:**将代码根据职责不同,进行分离分 ...

最新文章

  1. 【ArchSummit北京2015】公有云平台发展与建设实战解析
  2. Js作用域链及变量作用域
  3. Oracle下scott用户无法登录
  4. Nginx反向代理负载均衡时,验证码不正确
  5. OpenCV--fstream格式化读取坐标数据存为vector
  6. c语言应如何自学,C语言如何自学
  7. 数据挖掘实践(金融风控)——task02:数据分析
  8. python爬虫实例100例-Python爬虫 实例
  9. dict字典,以及字典的一些基本应用
  10. c语言怎么编程简易计算器,可编程简易计算器(代码)
  11. JAVA数据库连接池的工作机制
  12. 手机版服务器最新的,我的世界手机版服务器ip地址大全(持续更新)
  13. 不存在从“——”到“——*”的适当转换函数—已解决
  14. 软路由做网站服务器怎么样,为啥我不用双软路由(三)低成本和高体验
  15. 网页设计配色应用——色彩的调和
  16. electron 双击放大事件
  17. 基于注意力机制超分辨率汇总
  18. java卸载错误2503_修复控制面板卸载程序时提示错误代码2502、2503的方法
  19. 【数学分析】从多元函数的定义一直到多元函数的泰勒展开
  20. windows下nginx配置OpenSSL自签名证书

热门文章

  1. iOS简单实现查看更多/收起的效果
  2. 推荐一个可以减少开发量50%的插件!
  3. 分享400多道算法题,来挑战吧
  4. 再见, VS Code !你好,GitHub!
  5. 全站HTTPS来了!有何优势、与HTTP有何不同
  6. ThoughtWorks 2018技术雷达峰会(6月2日@深圳)
  7. “技术天才”李一男已出狱:曾被视为华为接班人!华中科大少年班,27岁华为副总裁,曾任百度CTO...
  8. 到底工资要多少合适?
  9. c 语言 二进制 十进制,C 语言实例 – 二进制与十进制相互转换 - C 语言基础教程...
  10. 雷林鹏分享:C# 事件(Event)