• JavaScript 设计模式



    1、单例模式 (Singleton pattern(https://baike.baidu.com/item/%E5%8D%95%E4%BE%8B%E6%A8%A1%E5%BC%8F/5946627?fr=aladdin)

            单例模式,是一种常用的软件设计模式。在它的核心结构中只包含一个被称为单例的特殊类。通过单例模式可以保证系统中一个类只有一个实例。即一个类只有一个对象实例

            单例模式会阻止其他对象实例化其自己的单例对象的副本,从而确保所有对象都访问唯一实例。因为类控制了实例化过程,所以类可以灵活更改实例化过程。

    实例:

    function GameEngine() {
    	if(GameEngine.instance) { 
    		return GameEngine.instance;
    	}
    	/**
    	 * 在编写js游戏时,我们希望游戏引擎只能有一个,保证游戏正常运行
    	 * 使用单例模式后,每次new GameEngine()都能保证是同一个,
    	 * 同时也方便了,在其他部件中进行接口通信
    	 */
    	GameEngine.instance = this;
    }
    GameEngine.prototype = {
    	//...
    }

    2、代理模式


    3、策略模式 Strategy Pattern

             一个类的行为或其算法可以在运行时更改。这种类型的设计模式属于行为型模式。在策略模式中,我们创建表示各种策略的对象和一个行为随着策略对象改变而改变的 context 对象。策略对象改变 context 对象的执行算法。

            使用场景:1、如果在一个系统里面有许多类,它们之间的区别仅在于它们的行为,那么使用策略模式可以动态地让一个对象在许多行为中选择一种行为。2、一个系统需要动态地在几种算法中选择一种。 3、如果一个对象有很多的行为,如果不用恰当的模式,这些行为就只好使用多重的条件选择语句来实现。

    实例:

    //color属性值有多种情况,每种情况执行不同的操作
    //if...else if条件判断,方法一:
    if(color) {
    	if(color === 'black') printBlack();
    	else if(color === 'red') printRed();
    	else if(color === 'blue') printBlue();
    	else if(color === 'green') printGreen();
    	else(color === 'yellow') printYellow();
    }
    //也会想到使用switch(),方法二:
    switch(color) {
    	case 'black':
    		printBlack();break();
    	case 'red':
    		printRed();break();
    	case 'blue':
    		printBlue();break();
    	case 'green':
    		printGreen();break();
    	default:
    		printYellow();
    }
    //方法一与方法二每次都需进行多次判断才能得到结果,效率是极低的
    //使用策略模式可以有效提高效率,方法三
    var colorObj = {
    	'black':printBlack,
    	'red':printRed,
    	'blue':printBlue,
    	'green':printGreen,
    	'yellow':printYellow
    }
    if(color in colorObj){
    	colorObj[color]();
    }

    4、观察者(监听)模式 Observer Pattern

           当对象间存在一对多关系时,则使用观察者模式(Observer Pattern)。比如,当一个对象被修改时,则会自动通知它的依赖对象。观察者模式属于行为型模式。

          使用场景: 1、有多个子类共有的方法,且逻辑相同。 2、重要的、复杂的方法,可以考虑作为模板方法。

         观察者模式与发布/订阅模式区别:http://www.cnblogs.com/lovesong/p/5272752.html

         

    /**
     * 场景:公司里有多个员工,员工需要及时的对公司所发的邮件进行处理
     * 那么,员工不可能时时刻刻向公司询问是否有新邮件,因此使用观察者模式
     * 每当公司有新邮件时,触发员工的预先设定的事件,当然这个事件必须是
     * 有统一的接口(此例中的接口是:Staff.getEmail)
     */
    function Company(){//公司类
    	this.staffList = [];//员工列表
    	this.addStaff = function(staff){//员工注册
    		this.staffList.push(staff);
    	}
    	this.sendEmail =function(){//公司发送邮件通知
    		this.staffList.forEach(function(item,index,arr){
    			item.getEmail();
    		});
    	}
    }
    function Staff(name){//员工类
    	this.name = name;
    	this.getEmail = function(){
    		//每个员工可自定义收到邮件的提示..后续工作.等
    		console.log(this.name);
    	}
    }
    var com = new Company();//实例公司
    var staffA = new Staff('a');//实例员工
    var staffB = new Staff('b');
    com.addStaff(staffA);//员工注册
    com.addStaff(staffB);
    com.sendEmail();//公司发送邮件



    参考:

    菜鸟教程设计模式:http://www.runoob.com/design-pattern/design-pattern-tutorial.html

  • 相关阅读:
    Springsecurity3.1.3配置多个登陆页面
    将数字转换为大写(保留小数点后面2位)
    纯JavaScript实现的二维码图片生成器
    poi导出excel
    发送邮件
    Lodop实现打印功能
    遍历list
    循环监听输入框回车事件
    监听回车事件记录
    简单的事务操作过程
  • 原文地址:https://www.cnblogs.com/fanlinqiang/p/7741212.html
Copyright © 2020-2023  润新知