章节
问答
课签
笔记
评论
占位
占位

代码封装

初学着写JS可以说都是毫无章法可言的,基本上是想到什么就写什么,就是一个接一个的函数function,遇到重复的还得copy,如果一不小心函数重名了,还真不知道从何开始查找错误,因为大家总是用面向过程的编程思想来写JS代码。当然也不是错误,只是从长远的发展角度来说,我们更希望代码是易维护、易扩展的也是程序员经常挂在嘴边的口头禅"高内聚 低耦合"。

基础性的东西这里不过多讨论。以圣诞主题为例,拥有3个场景页面,在设计上,我会将每一个场景当作一个独立的"场景对象",场景内部都封装了各自的子对象,对象与对象之间通过接口调用。简单的说就是将行为封装分布在各个对象中,并让这些对象自己各自负责自己的行为,这也是面向对象设计的一个优点。

就拿页面切换的效果来说,场景A需要切换到场景B,那么元素A不需要关心页面是怎么切换的,它只能要调用到一个接口方法能让页面切换就行了

基于这样的理论,我们就开始简单的改造整个代码结构这块

设计3个独立的JS文件分别是page-a.js、page-b.js、page-c.js,分别对应了3个场景类,把每一个场景的内容封装到每一个场景类中

然后在三个场景类之间通过接口去调用,比如切换页面,所以需要创建一个"中介"对象(christmas.js)充当,接口分配任务。

JavaScript的的类的概念也不是那么"正宗的",同时也没有规范上的抽象类与接口的支持,所以很大程度上实现封装都是靠闭包去模拟,具体可以参考右边代码区域

任务

?不会了怎么办
||

提问题

写笔记

公开笔记
提交
||

请验证,完成请求

由于请求次数过多,请先验证,完成再次请求

加群二维码

打开微信扫码自动绑定

您还未绑定服务号

绑定后可得到

  • · 粉丝专属优惠福利
  • · 大咖直播交流干货
  • · 课程更新,问题答复提醒
  • · 账号支付安全提醒

收藏课程后,能更快找到我哦~

使用 Ctrl+D 可将课程添加到书签

邀请您关注公众号
关注后,及时获悉本课程动态

举报

0/150
提交
取消
全部 精华 我要发布
全部 我要发布
最热 最新
只看我的

手记推荐

更多

本次提问将花费2个积分

你的积分不足,无法发表

为什么扣积分?

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分?