本文由 发布，转载请注明出处，如有问题请联系我们！ 发布时间: 2021-08-01else的用法与位置-else的三种用法

序

在商品快速迭代的环节中，因为追求完美开发设计速率，大家通常忽视了编码的易读性和扩展性。if-else标准分辨的不科学应用，会大大增加大家程序流程的复杂性，与此同时会快速减少编码的易读性，大大增加中后期维护保养的难度系数，真的是令人头痛。例如现在的事例:

// 申请贷款实际操作的解决function check {// 是不是键入恰当登录名if (this.checkUsername(this.username)) {// 是不是键入恰当身份证号码if (this.checkIDCard(this.idCard)) {// 输入您恰当的联系电话if (this.checkTel(this.tel)) {// 贷款担保人是自己if (this.dbr === '贷款担保人是自己') {// 是不是存有身份证正面if (document.querySelector('.sfzzm img')) {console.log('存有身份证正面')// 是不是存有身份证反面if (document.querySelector('.sfzfm img')) {console.log('存有身份证反面')// 是不是存有毕业证书if (document.querySelector('.xlzs img')) {console.log('存有毕业证书')if (this.ydxy) {this.tijiaoIsShow = false}} else {Toast('请提交毕业证书')this.tijiaoIsShow = true}} else {Toast('请提交身份证反面')}} else {Toast('请提交身份证正面')}} else if (this.dbr == '贷款担保人不是本人') {if (this.checkUsername(this.dbrname)) {if (this.checkIdCard(this.dbridCard)) {if (this.checkTel(this.dbrzyzh)) {if (document.querySelector('.sfzzm img')) {console.log('存有身份证正面')if (document.querySelector('.sfzfm img')) {console.log('存有身份证反面')if (document.querySelector('.xlzs img')) {console.log('存有毕业证书')this.tijiaoIsShow = false} else {Toast('请提交毕业证书')}} else {Toast('请提交身份证反面')}} else {Toast('请提交身份证正面')}} else {Toast('输入您贷款担保人开展业务的证号')}} else {Toast('输入您贷款担保人身份证号码')}} else {Toast('输入您贷款担保人名字')}} else {Toast('挑选贷款担保人是不是为自己')}} else {Toast('输入您恰当的联系电话')}} else {Toast('输入您恰当的身份证号码')}} else {Toast('输入您恰当的名字')}}

假如你接任那样一段编码，我坚信大伙儿和此刻的心情是一样的:

文中归纳了下列提升的if-else情景，期待对各位有一定的协助。

单独if语句提升if/else句子提升单独if多标准提升好几个else if支系提升单if语句的提升。

提升前。

if (flag) {this.handleFn}

提升后

flag && this.handleFn// handleFn是一般涵数

这类书写清楚，简约，最易读！

此外，如果有许多if语句，可是连接的功用是一致的，我们可以应用“逻辑性and”或“逻辑性or”将他们组成一个关系式。如果我们的单独标准分辨能够看做是同一次查验的当场，那麼一次查验的用意在易读性上显著好于数次标准查验。使我们看一个编码精彩片段:

if (!(staffInfo.patientName && staffInfo.phone)) {// doSomething}...if (!(staffInfo.phone && staffInfo.idCardNum)) {// doSomething}if(!(staffInfo.patientName && staffInfo.phone) || !(staffInfo.phone && staffInfo.idCardNum)){// doSomething}

if/else句子提升if(！(staffinfo . patient name & & staffinfo . phone)| |！(staffinfo . phone & & staffinfo . idcard num)){//做某件事} if/else句子提升。

If/else能够说成新项目中常常碰到的，一般能够根据这二种对策开展提升。

排非对策三元运算符

排非对策

例如在账号登录情景中，假如登录名和登陆密码文本框是空，那麼大家会显示客户“登录名和登陆密码不可以是空”；如果有值，则实行登陆实际操作。

提升前。

if (user && password) {// 逻辑性解决} else {throw('登录名和登陆密码不可以为空!')}

提升后

if (!user || !password) return throw('登录名和登陆密码不可以为空!')// 逻辑性解决

表单提交时，必须事前清除这些不标准的內容。一般在表单提交时，大家无法符合要求的状况要超过大家取得成功上传的状况，因此清除对策是一个很好的挑选。

三元运算符

第一个事例

let allow = if（age >= 18）{allow = '根据';} else {allow = '回绝';}// 提升后let allow = age >= 18 ? '根据' : '回绝'

例2

if (flag) {success;} else {fail;}//提升后flag ? success : fail;

与if/else对比，三元运算符只必须一行句子，编码简约精练。

单if多标准提升。

提升前。

function test(type) {if (type === 'jpg' || type === 'png' || type === 'gif' || type === 'svg') {console.log("该文件为照片");}}

提升后

function test(type) {const imgArr = ['jpg', 'png', 'gif', 'svg']if (imgArr.includes(type)) {console.log("该文件为照片")}}好几个if支系的提升。

Multiple else if一般是一个不太好的挑选，这会造成设计方案繁杂，编码易读性差，并很有可能造成重新构建艰难。

if (this.type === 'A') {this.handleA;} else if (this.type === 'B') {this.handleB;} else if (this.type === 'C') {this.handleC;} else if (this.type === 'D') {this.handleD;} else {this.handleE;}

大家时常会出现好几个if标准分辨码。伴随着逻辑性复杂性的提升，不然编码会愈来愈澎涨。

把逻辑图看作流程表。从里面的流程表能够看得出，不一样标准支系的编码具备很高的耦合性。以前的标准分辨会危害后面的编码流，这类编码在事后的研发中难以维护保养。我们可以根据电源开关，键值和投射来提升编码。

switch

switch(val){case 'A':handleAbreakcase 'B':handleBbreakcase 'C':handleCbreakcase 'D':handleDbreak}

看逻辑性，画流程图。

变换

流程表显而易见更简易。并且，不一样标准支系中间沒有嵌入，互不相关。逻辑性很清晰。

key-value

尽管switch句子在逻辑性上比else if语句简易，但编码自身要略微简易一些。

事实上，大家的目标枚举类型了将标准与特殊实际操作密切相关的键值。

let enums = {'A': handleA,'B': handleB,'C': handleC,'D': handleD,'E': handleE}function action(val){let handleType = enums[val]handleType}

流程表:

此方式清除了全部if语句，并应用键值目标来储存标准和实际操作中间的关联。在我们必须依据情况实行编码时，不会再必须应用else if或switch句子来解决相对应的姿势，只必须获取相对应的涵数handleType并实行就可以。

Map

实际上，我们可以根据Map进一步提升大家的编码。

与目标对比，地形图有很多优势。

目标的键只有是字符串数组或符号，而Map的键能够是一切种类的值。我们可以应用Map size特性轻轻松松获得Map的键/值对的总数，而目标的键/值对的总数只有手动式明确。具备很快的搜索速率。

上边的事例能够提升如下所示:

let enums = new Map([['A', handleA],['B', handleB],['C', handleC],['D', handleD],['E', handleE]])function action(val){let handleType = enums(val)handleType}

假如碰到双层繁杂状况，Map句子的优点会更为显著！

if (mode == 'kline') {if (this.type === 'A') {this.handleA} else if (this.type === 'B') {this.handleB} else if (this.type === 'C') {this.handleC} else if (this.type === 'D') {this.handleD}} else if ((mode = 'depth')) {if (this.type === 'A') {this.handleA} else if (this.type === 'B') {this.handleB} else if (this.type === 'C') {this.handleC} else if (this.type === 'D') {this.handleD}}

针对这般错综复杂的情景，能不能根据Map开展提升？

实际上，大家只要将不一样的分辨句子组合成一个字符串数组，那样人们就可以以键值文件格式将标准和实际操作关系在一起。

let enums = new Map([['kline_A', handleKlineA],['kline_B', handleKlineB],['kline_C', handleKlineC],['kline_D', handleKlineD],['kline_E', handleKlineE],['depth_A', handleDepthA],['depth_B', handleDepthB],['depth_C', handleDepthC],])function action(mode, type){let key = `${mode}_${type}`let handleType = enums(key)handleType}

一瞬间就简洁明了许多，也有~ ~ ~

参照文章内容

if-else重新构建提升if-else判断推理提升How to Use if-elseJavascriptif语句优化策略从入门到精通代码设计﹣if/else