文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

六个避免过度使用 IF 语句的技巧

2024-12-13 15:23

关注

接下来,我将与你一起来分享这 6 种避免过度使用 if 的方法,这不是抵制使用if的偏执,而是换一种方式来思考我们的编程思路。

1. 三元条件运算符

示例 1:

带有 if 的代码:

function customerValidation(customer) {
if (!customer.email) {
return error('email is require')
} else if (!customer.login) {
return error('login is required')
} else if (!customer.name) {
return error('name is required')
} else {
return customer
}
}

重构代码:

const customerValidation = customer =>
!customer.email ? error('email is required')
: !customer.login ? error('login is required')
: !customer.name ? error('name is required')
: customer

示例 2:

带有 if 的代码:

function getEventTarget(evt) {
if (!evt) {
evt = window.event;
}
if (!evt) {
return;
}
const target;
if (evt.target) {
target = evt.target;
} else {
target = evt.srcElement;
}
return target;
}

重构代码:    

function getEventTarget(evt) {
evt = evt || window.event;
return evt && (evt.target || evt.srcElement);
}

2.短路逻辑运算符

示例 1:

带有 if 的代码:

const isOnline = true;
const makeReservation= ()=>{};
const user = {
name:'Damian',
age:32,
dni:33295000
};


if (isOnline){
makeReservation(user);
}

重构代码:

const isOnline = true;
const makeReservation= ()=>{};
const user = {
name:'Damian',
age:32,
dni:33295000
};


isOnline&&makeReservation(user);

示例 2:

带有 if 的代码:

const active = true;
const loan = {
uuid:123456,
ammount:10,
requestedBy:'rick'
};


const sendMoney = ()=>{};


if (active&&loan){
sendMoney();
}

重构代码:

const active = true;
const loan = {
uuid:123456,
ammount:10,
requestedBy:'rick'
};


const sendMoney = ()=>{};


active && loan && sendMoney();

3.功能委托

示例 1:

带有 if 的代码:

function itemDropped(item, location) {
if (!item) {
return false;
} else if (outOfBounds(location) {
var error = outOfBounds;
server.notify(item, error);
items.resetAll();
return false;
} else {
animateCanvas();
server.notify(item, location);
return true;
}
}

重构代码:

function itemDropped(item, location) {
const dropOut = function() {
server.notify(item, outOfBounds);
items.resetAll();
return false;
}


const dropIn = function() {
server.notify(item, location);
animateCanvas();
return true;
}


return !!item && (outOfBounds(location) ? dropOut() : dropIn());
}

4. 非分支策略

示例 1:

带开关的代码:

switch(breed){
case 'border':
return 'Border Collies are good boys and girls.';
break;
case 'pitbull':
return 'Pit Bulls are good boys and girls.';
break;
case 'german':
return 'German Shepherds are good boys and girls.';
break;
default:
return 'Im default'
}

重构代码:

const dogSwitch = (breed) =>({
"border": "Border Collies are good boys and girls.",
"pitbull": "Pit Bulls are good boys and girls.",
"german": "German Shepherds are good boys and girls.",
})[breed]||'Im the default';


dogSwitch("border xxx")

5.作为数据的函数

我们知道在 JS 中函数是第一类,所以使用它我们可以将代码拆分成一个函数对象。

带有 if 的代码:

const calc = {
run: function(op, n1, n2) {
const result;
if (op == "add") {
result = n1 + n2;
} else if (op == "sub" ) {
result = n1 - n2;
} else if (op == "mult" ) {
result = n1 * n2;
} else if (op == "div" ) {
result = n1 / n2;
}
return result;
}
}


calc.run("sub", 5, 3); //2

重构代码:

const calc = {
add : function(a,b) {
return a + b;
},
sub : function(a,b) {
return a - b;
},
mult : function(a,b) {
return a * b;
},
div : function(a,b) {
return a / b;
},
run: function(fn, a, b) {
return fn && fn(a,b);
}
}


calc.run(calc.mult, 7, 4); //28

6.多态性

多态性是一个对象具有多种形式的能力,OOP 中多态性最常见的用法是使用父类引用来引用子类对象。

带有 if 的代码:

const bob = {
name:'Bob',
salary:1000,
job_type:'DEVELOPER'
};


const mary = {
name:'Mary',
salary:1000,
job_type:'QA'
};


const calc = (person) =>{


if (people.job_type==='DEVELOPER')
return person.salary+9000*0.10;


if (people.job_type==='QA')
return person.salary+1000*0.60;
}


console.log('Salary',calc(bob));
console.log('Salary',calc(mary));

重构代码:

const qaSalary  = (base) => base+9000*0.10;
const devSalary = (base) => base+1000*0.60;


//Add function to the object.
const bob = {
name:'Bob',
salary:1000,
job_type:'DEVELOPER',
calc: devSalary
};


const mary = {
name:'Mary',
salary:1000,
job_type:'QA',
calc: qaSalary
};


console.log('Salary',bob.calc(bob.salary));
console.log('Salary',mary.calc(mary.salary));
来源:web前端开发内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     813人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     354人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     318人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     435人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     224人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-后端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯