JS_2个值相互转换,实现与优化

前端开发  浏览器兼容性
ie6浏览器兼容性前端开发
前端开发浏览器内核
功能:要2个值之间相互转换输出
就是这样:
未付款 <-> 0
    已付款 <-> 1
        无效 <-> 4
            线下 <-> 5

 

                下面是我的第一次实现方法:
                首先想到的是最简单的 if else 或者 switch 选择了, 不过代码量看起来很多!不爽{:1_526:}
                 function convertStatus(value){
                switch(value){
                case “未付款” :
                return 0;
                case “已付款” :
                return 1;
                case “无效” :
                return 4;
                case “线下” :
                return 5;
                case 0:
                return “未付款”;
                case 1:
                return “已付款”;
                case 4:
                return “无效”;
                case 5:
                return “线下”;
                }
                }

 

                然后就想到了用三目运算符来精简代码
                 function convertStatus_1(value){
                return value==”未付款” ? 0 : value==”已付款” ? 1 : value==”无效” ? 4 : value==”线下” ? 5 : value==0 ? “未付款” : value==1 ?
                “已付款” : value==4 ? “无效” : value==5 ? “线下” : null;
                }
                这个看起来1行好像是简单好多,但是易读性很差,不太好{:1_527:} 换!

 

                然后怎么想不出来怎么优化,只能找找大神给点思路。

 

                最后在大神们的指导下,换成这种方式了,以前完全没想到这样做,涨姿势了{:1_492:}
                 function convertStatus_2(value){
                var config = {
                “未付款” : 0,
                “已付款” : 1,
                “无效” : 4,
                “线下” : 5,
                ‘0’ : “未付款”,
                ‘1’ : “已付款”,
                ‘4’ : “无效”,
                ‘5’ : “线下”
                }
                return value in config ? config[value] : null ;
                }
                这个把值都写进了1个config对象,然后用 in 操作符进行属性查找,然后返回属性值!

 

                还有另外1个方法是:
                config.hasOwnProperty(value) ? config[value] : null

 

                突然出现了2个新东西,一下子就兴趣来了,赶紧百度是什么东西!

 

                in操作符用来判断某个属性属于某个对象,可以是对象的直接属性,也可以是通过prototype继承的属性。
                hasOwnProperty:是用来判断一个对象是否有你给出名称的属性或对象。不过需要注意的是,此方法无法检查该对象的原型链中是否具有该属性,该属性必须是对象本身的一个成员。

 

                瞬间又涨姿势了。虽然在这次的功能无需用到 hasOwnproperty ,但是当原型链很复杂的时候,继承了很多东西的时候,就很有用了!{:1_495:}

 

前端开发解决浏览器的兼容性
前端开发常见的浏览器兼容问题
前端开发最好用的浏览器
» 本文来自:前端开发者 » 《JS_2个值相互转换,实现与优化》
» 本文链接地址:https://www.rokub.com/6538.html
» 您也可以订阅本站:https://www.rokub.com
赞(0)
64K

评论 抢沙发

评论前必须登录!