注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

梦幻雪冰

技在手,能在身,思在脑,从容过生活——陈能堡

 
 
 

日志

 
 

JavaScript 高级开发-设计模式入门  

2015-04-25 23:59:22|  分类: JavaScript |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
在给大家介绍设计模式的时候,不是给大家介绍基本的命令,主要以例子的模式给大家进行讲解。现在项目经理安排一个任务让你来完成一个需求,创建一个student的基本信息,包括学生姓名、学生成绩、成绩信息三项内容。需要对学生成绩进行判断,根据不同的分数段,设置不同的成绩信息(不及格,及格,良,优秀)。
这需求实现难度并不是很大,如果要考虑多方面的话,难度就有点大了。先不考虑那么多,先来把基本功能实现了,再去考虑代码的优化和性能的优化。
代码如下:
  • // 学生对象
  • var baobao = {};
  • baobao.name = "梦幻雪冰";
  • baobao.score = "60";
  • // 根据成绩进行设置成绩信息
  • if (baobao.score < 60) {
  •     baobao.scoreInfo = '不及格';
  • } else if (baobao.score < 70) {
  •     baobao.scoreInfo = '及格';
  • } else if (baobao.score < 80) {
  •     baobao.scoreInfo = '良';
  • } else if (baobao.score < 100) {
  •     baobao.scoreInfo = '优秀';
  • }
  • console.log(baobao.scoreInfo);
  • // 学生对象
  • var lili = {};
  • lili.name = "独行冰海";
  • lili.score = "80";
  • // 调用方法
  • if (lili.score < 60) {
  •     lili.scoreInfo = '不及格';
  • } else if (lili.score < 70) {
  •     lili.scoreInfo = '及格';
  • } else if (lili.score < 80) {
  •     lili.scoreInfo = '良';
  • } else if (lili.score < 100) {
  •     lili.scoreInfo = '优秀';
  • }
  • console.log(lili.scoreInfo);
功能是基本实现了,但是项目经理后面又说,又有1000个学生需要进行创建,然后你瞬间觉得整个人都不好了。1000个学生不说别的,成绩判断那些代码重复了几次,那我们可以不可以考虑把那些重复的代码进行函数的封装,提高代码的重用性。于是只能去乖乖的实现代码。
  • var baobao = {};
  • baobao.name = "梦幻雪冰";
  • baobao.score = "60";
  • // 调用方法
  • setScore(baobao);
  • var lili = {};
  • lili.name = "独行冰海";
  • lili.score = "80";
  • // 调用方法
  • setScore(lili);
  • /*
  • * [根据学生成绩设置成绩信息]
  • * @author 梦幻雪冰——陈能堡
  • * @param {[对象]} obj [学生对象]
  • */
  • function setScore(obj) {
  •     if (obj.score < 60) {
  •         obj.scoreInfo = '不及格';
  •     } else if (obj.score < 70) {
  •         obj.scoreInfo = '及格';
  •     } else if (obj.score < 80) {
  •         obj.scoreInfo = '良';
  •     } else if (obj.score < 100) {
  •         obj.scoreInfo = '优秀';
  •     }
  •     console.log(obj.scoreInfo);
  • }
需求修改完成了,心也舒坦了一下,苦逼的是项目经理又跑过来说,如果这样来创建1000个学生对象,导致全局变量太多了,代码的复用性不高。于是去网上查资料和书本,发现了一个不错的方法,那就是工厂模式。
下一集继续给大家介绍设计模式——工厂模式。



欢迎学习交流——梦幻雪冰独行冰海@font-face中iefix的详解 - 梦幻雪冰 - 梦幻雪冰
HTML5学堂贴吧——HTML5学堂
HTML5学堂微博——HTML5学堂
HTML5学堂官网——HTML5学堂
HTML5学堂微信
setInterval和setTimeout参数剖析 - 梦幻雪冰 - 梦幻雪冰
  评论这张
 
阅读(95)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017