前端开发 浏览器兼容性 |
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:}
前端开发解决浏览器的兼容性 |
前端开发常见的浏览器兼容问题 |
前端开发最好用的浏览器 |
评论前必须登录!
注册