美文网首页
JavaScript设计原则与编程技巧

JavaScript设计原则与编程技巧

作者: yozosann | 来源:发表于2017-10-31 11:20 被阅读0次

    本文源于本人关于《JavaScript设计模式与开发实践》(曾探著)的阅读总结。想详细了解具体内容建议阅读该书。

    1. 单一责任原则(SRP)

    定义:一个对象(方法)只做一件事情。
    设计模式中的SRP
    • 代理模式:图片预加载,讲预加载的功能放在代理对象中。
    • 迭代器模式;appendDiv本来只负责渲染div,但是还承担了遍历的效果,这里使用迭代器把遍历功能提取出,渲染作为一个回调函数。
    • 单例模式:将管理单例的功能提出。
    • 装饰者模式:装饰者来执行额外的功能。
    优缺点:
    • 优点:降低了单个类或者对象的复杂度,易于维护。
    • 缺点:单个类的复杂度降低,意味着一些对象之间相互联系的复杂度。

    2. 最少知识原则(LKP)

    定义:一个软件实体应当少地与其他实体发生相互作用(对象,系统,函数,模块,组件等)。

    例子:一个将军如果想要挖掘一些散兵坑,不可能先叫少校,再叫上尉,再叫一个军士兵,再布置任务。他应该仅仅叫少校,其他交给别人去做就ok了。

    设计模式中的LKP
    • 中介者模式:飞机飞行,引入调度塔。
    在封装中体现的LKP:把变量的可见性限制在一个尽可能小的范围内,这个变量对其他不相关模块的影响就越小,被改写发生冲突的概率越小。

    3. 开放-封闭原则(OCP)

    定义:软件实体(类,模块,函数等),应该是可以扩展的,但不可以被修改。软件编程中最重要的一条原则。
    引申:当需要改变一个程序功能时或者给这个程序添加新功能的时候,可以使用增加代码的方式,但是不允许改动源程序。
    找出变化的地方:找出程序将要变化的部分,然后把变化封装起来。
    • 放置挂钩:给予子类个性化处理。
    • 使用回调函数:迭代器。
    设计模式中的OCP:
    • 发布订阅者模式:当有新的订阅者,发布者的代码不需要进行任何修改。
    • 模版方法模式:子类执行的方法和顺序是不改变的,而具体如何实现是可变的。
    • 策略模式:使用策略和策略类是分开的。
    • 责任链模式:当前执行不了的直接转交给下一个节点,当有改变时增添节点即可。
    相对性:
    • 挑选出最容易发生变化的地方,构造抽象封闭变化。
    • 在不可避免发生修改的时候,尽量修改那些相对容易修改的地方。

    4. 基础代码重构

    • 合并重复条件判断:
    var totalPage = 100;
    
    var paging1 = function(currPage) {
      if(currPage <= 0) {
        currPage = 0;
        jump(currPage);
      } else if(currPage >= totalPage) {
        currPage = totalPage;
        jump(currPage);
      } else {
        jump(currPage);
      }
    }
    

    jump函数写了三次,完全可以提炼出来:

    var paging2 = function(currPage) {
      if(currPage <= 0) {
        currPage = 0;
      } else if(currPage >= totalPage) {
        currPage = totalPage;
      }
      jump(currPage);
    }
    
    • 把条件分支语句提炼为函数:
    var getPrice = function(price) {
      var date = new Date();
      if(date.getMonth() >= 6 && date.getMonth() <= 9) {
        return price * 8;
      }
    
      return price;
    }
    
    function isSummer() {
      return date.getMonth() >= 6 && date.getMonth() <= 9;
    }
    

    if中语句含义太弱,直接可以提炼为一个函数,增强语意。

    • 合理利用循环:
      如果要判断几个函数是否能够调用,不要一个一个写if-else,可以直接利用循环:
    var funcArr = [func1, func2, func3];
    
    for(var i = 0,func; func = funcArr[i++];){
        if(!func) {
            return;
        }
        func();
        break;
    }
    
    • 提前让函数退出代替嵌套条件分支:
    var del = function (obj) {
      var ret;
      if (!obj.isReadOnly) {
        if (obj.isFolder) {
          ret = deleteFolder(obj);
        } else if (obj.isFile) {
          ret = deleteFile(obj);
        }
      }
      return ret;
    }
    
    var del = function (obj) {
      if (obj.isReadOnly) {
        return;
      }
      if (obj.isFile) {
        return deleteFile();
      }
      if (obj.isFolder) {
        return deleteFolder();
      }
    }
    
    • 传递对象参数代替太长的参数列表
    • 尽量减少参数数量
    • 不使用多层三目嵌套
    • 合理使用链式调用:不利于调试
    • 如果一个类过大,建议拆分为各个小类
    • 用return退出多层循环

    相关文章

      网友评论

          本文标题:JavaScript设计原则与编程技巧

          本文链接:https://www.haomeiwen.com/subject/gutbpxtx.html