zoukankan      html  css  js  c++  java
  • review一个javascript功能函数

        近半年来一直觉得自己在技术上好像左右挣扎,技术没啥提升,看书看不进,自学还挺慢。写出来的东西,自己都觉得不满意。让自己也用庸人自扰的感觉。

        最近,在工作中,有一个小小的功能需要实现,这个功能非常简单,其大概功能是:当有一批商品需要促销时,满多少到多少元区间立减多少元,再比较离下一个优惠区间还差多少元,并提示下一区间的优惠价。比如,我这里有个价格优惠区间(满50减5,满100减10,满150减15,满200减20),如果我现在买了120元商品,那么我的提示就应该是:已优惠10,还差30元,可优惠15元。

        这个功能是满简单的,因为优惠的价格区间是变化的,没办法在程序中写死。所以后端的同学就会把这个优惠的价格区间用一种字符格式输出来,我们再进行处理。字符格式如下:

    <input type="hidden" name="priceRange" value="50:5,100:10,150:15,200:20" />

        我是直接把input的value处理成了一个对象{'50':5, '100':10, '150':15, '200':20}方便我我以后的处理。

        为了能获取价格区间,我创建一个数组用来存放对象的key值,也就是所说的价格区间。

    var priceRange = {'50':5, '100':10, '150':15, '200':20};
    function getPrice(num,priceRange) {
        var oPrice = priceRange || {},
            aPrice = [],
            _pro;
        
        for (_pro in oPrice) {
            aPrice.push(_pro);
        }
        // ...
    }

        接下来就是通过循环这个价格区间找出优惠的价格,并返回一个结果对象。

    var priceRange = {'50':5, '100':10, '150':15, '200':20};
    function getPrice(num,priceRange) {
        // ...
        for (var i = 0, len = aPrice.length; i < len; i++) {
            if (aPrice[0] > num) {
                break;
            }
            
            if (i === (len - 1)) {
                if (aPrice[i] <= num) {
                    return {
                        hasPrice: oPrice[aPrice[i]]
                    }
                }
            } else {
                if (aPrice[i] <= num && num < aPrice[i + 1]) {
                    return {
                        hasPrice: oPrice[aPrice[i]],
                        price: aPrice[i + 1] - num,
                        youhui: oPrice[aPrice[i + 1]]
                    }
                }
            }
        }
        // ...
    }

        上面就是这个功能实现的比较关键的部分,下面看下完整的代码:

    var priceRange = {'50':5, '100':10, '150':15, '200':20};
    function getPrice(num, priceRange) {
        var oPrice = priceRange || {},
            aPrice = [],
            _pro;
        
        for (_pro in oPrice) {
            aPrice.push(_pro);
        }
    
        for (var i = 0, len = aPrice.length; i < len; i++) {
            if (aPrice[0] > num) {
                break;
            }
            
            if (i === (len - 1)) {
                if (aPrice[i] <= num) {
                    return {
                        hasPrice: oPrice[aPrice[i]]
                    }
                }
            } else {
                if (aPrice[i] <= num && num < aPrice[i + 1]) {
                    return {
                        hasPrice: oPrice[aPrice[i]], // 此价格的优惠价
                        price: aPrice[i + 1] - num, // 此价格离下一个价格的差
                        youhui: oPrice[aPrice[i + 1]] // 离下一个价格的优惠价
                    }
                }
            }
        }
        return {
            hasPrice: 0,
            price: aPrice[0] ? aPrice[0] - num : 0,
            youhui: aPrice[1] ? oPrice[aPrice[1]] : 0
        }
    }
    
    console.log(getPrice(12, priceRange));

        虽然,这个功能的代码写出来了,但是我总觉得那个地方写不好,但是自己却发现不了。所以,写出来,大家帮我code review.看看有没有更好的写法,不要吝惜自己的才华,请在评价那里一展你的风采。

  • 相关阅读:
    前端响应式开发
    前端兼容性问题解决方案(二)
    web storage
    flex布局 滚动条失效
    ant-design-vue form表单 defaultValue默认值
    node express 中间件 http-proxy-middleware 和 express-http-proxy 转发 搞定 post 超时
    Math.min & Math.max & apply
    Backbone源码分析-noConflict
    安卓下浏览器(包括微信)video 小窗口播放
    前端工作流
  • 原文地址:https://www.cnblogs.com/qiheng/p/3815892.html
Copyright © 2011-2022 走看看