在前端,我们大多习惯使用if…else if…else来进行判断,但是这样做代码不美观,而且可读性低且性能差,于是写了这么一篇博客。
关于if…else的优化:
优化前的代码:
function daxiao(number) {
var n =Math.floor(Math.random()*100);
if (number == n) {
return "值相等";
}else {
return "值不相等";
}
}
1.推荐将最常见的条件放在首位。
优化后:
function daxiao(number) {
var n =Math.floor(Math.random()*100);
if (number != n) {
return "值不相等";
}else {
return "值相等";
}
}
2.推荐使用三元运算符号来进行优化。(条件判断)? (是,执行):(否,执行),如果是或否里不执行任何操作,可用null、undefined等占位。
优化后:
function daxiao(number) {
var n =Math.floor(Math.random()*100);
return number == n ? "值相等":"值不相等";
}
}
关于if…else if…else的优化:
优化前的代码:
function daxiao(number) {
var n =Math.floor(Math.random()*100);
if (number == n) {
return "刚刚好";
}else if(number < n){
return "number值小了";
}else {
return "mumber值大了";
}
}
1.推荐将最常见的条件放在首位。
优化后:
function daxiao(number) {
var n =Math.floor(Math.random()*100);
if (number > n) {
return "number值大了";
}else if(number < n){
return "number值小了";
}else {
return "刚刚好";
}
}
2.switch/case。条件数量较大的话,就建议选用switch。 在大多数的情况下switch比if else运行的更加快。
优化后:
function daxiao(number) {
var n =Math.floor(Math.random()*100);
switch(true) {
case number > n:
return "number值大了";
case number < n:
return "number值小了";
default:
return "刚刚好";
}
}
3.使用数组优化。
优化后:
function daxiao(number) {
let string = "今天是星期";
let date = new Date().getDay();
// 使用数组
let dateArr = ["天","一","二","三","四","五","六"];
return string + dateArr[date]
}
4.使用对象优化。
优化后:
function daxiao(number) {
let string = "今天是星期";
let date = new Date().getDay();
// 使用对象
dateObj = {
0: "天",
1: "一",
2: "二",
3: "三",
4: "四",
5: "五",
6: "六",
};
return string + dateObj[date]
}
5.使用 charAt 字符方法。
优化后:
function daxiao(number) {
return "今天是星期" + "日一二三四五六".charAt(new Date().getDay());
}