本文最后更新于:2020-05-02 23:15:41
1.基本if else 逻辑判断
let sex = 1;
let sexText = '';
if(sex === 1){
sexText = '男';
}else if(sex === 2){
sexText = '女';
}else {
sexText = '其他';
}
2.switch/case
const getStatusText = (status) => {
let str = '';
switch (status) {
case 1:
str="待开通";
break;
case 2:
str="开通准备中";
break;
case 3:
str="开通准备完成";
break;
default:
str="已过期";
break;
}
return str;
}
3.三元表达式
let sex = 1;
let sexText = sex === 1 ? '男' : sex === 2 ? '女': '其他';
4.短路 && 与 ||
&& 中第一个表达式为假就不会去处理第二个表达式,|| 则相反
// if为真
if (bool) {
value = getValueTrue();
}
// &&改版
bool && (value = getValueTrue());
// if为假
if (!bool) {
value = getValueFalse();
}
// || 改版
bool || (value = getValueFalse());
5.对象 或 数组
const getStatusText = (status) => {
let statusObj = {
1: '待开通',
2: '开通准备中',
3: '开通准备完成'
};
return statusObj[status] ? statusObj[status] : '';
}
const getStatus = (status) => {
let statusArr = ['待开通','开通准备中','开通准备完成']
return statusArr[status-1] ? statusArr[status-1] : '';
}
6.includes
if (operate === 'submitAudit' || operate === 'cancelUpdate' || operate === 'uplineApplet') {
this.handleOperate(operate, row);
return;
}
//使用includes
const actionArr = ['submitAudit','cancelUpdate','uplineApplet'];
if(actionArr.includes(operate)){
this.handleOperate(operate, row);
return;
}
7.Map
假如:
‘待开通’ 具有 设置版本setVersion 的操作
‘开通准备中’ 无操作
‘开通准备完成’ 具有发布releaseApplet和取消本次开通cancelDredge的操作
const getStatus = (status) => {
const maps = new Map([
[1,['待开通',['setVersion']]],
[2,['开通准备中',]],
[3,['开通准备完成',['releaseApplet','cancelDredge']]],
])
const action = maps.get(status);
let obj = {
statusText:'',
statusFn:[],
}
obj.statusText = action[0];// ["待开通"]
obj.statusFn = action[1] || [];// ['setVersion']
return obj;
}
getStatus(2) // { statusText: "开通准备中",statusFn: [] }
其他复杂的Map用法可以参看这边文章
本博客所有文章除特别声明外,均采用 CC BY-SA 3.0协议 。转载请注明出处!