简单谈谈我对策略模式的理解

本文介绍了策略模式的概念及其在React项目中的实际应用案例。通过将不同场景下的组件渲染逻辑抽象为策略对象,实现了组件复用性和扩展性的提升。文章还提到了策略模式在动画控制等其他场景的应用。

模式应用场景

一个方法内的某个行为,在不同的场景中,该行为可以有不同的实现方案,策略模式就是把这些算法从该方法内分离开来单独一个个实现,该方法只管根据场景使用对的某个算法就好

个人近些日子来项目中的运用

  • react中的render方法中的一个应用
    看下面这段代码,这边若不用策略模式,我以往的代码方式可能就会再render方法的jsx中增加一堆if、else的分支判断来判断要渲染哪个组件,现在把它集中提取到了一个对象中类,以后若需求变了,就改这对象就好,而不用动用组件内部的代码
// 哪个tab对应哪个组件的一个conf
const TAB_PANE_CONF = {
    [onekey] : (<BasicSet/>),
    [otherkey] : (<RemindSet/>),
    [anotherkey]] : (null),
};
// 某组件的render方法中
render() {
        const {router} = this.context;
        // 会根据viewcondition来切换tabPane
        const {viewcondition} = this.props;


        return (
            <div style={{height:"100%"}} className={'sms-bs'}>
                        <Tab />
                        {
                            TAB_PANE_CONF[viewcondition]
                        }
                        {/*some other view here*/}
            </div>
        )
    }
  • 其他运用
    其实我很早就运用过策略模式了,只是我自己不知道而已,之前做过js动画,用到过tween算法,doAnimate(animateForm)方法中接收不同的参数来表示想要进行的动画形式,最后具体怎么进行动画统一由tween算法对象来控制,这其实也是个策略模式的例子
    详细可参见《JavaScript设计模式与开发实践》中的策略模式一章

转载于:https://www.cnblogs.com/zhangrenjian/p/8807249.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值