JavaScript:分支条件和模糊需求

我们的代码里会大量的需要各种判断。比如:如果用户没有登录,如果用户输入的密码错误,如果求助有人应答……这时候就需要使用:

if...else

中文就是:如果(if)...否则(else)……的意思

假设我们要判断一个数是不是正数:

var a = -1; //或者 a = 1 if (a > 0) { console.log('正数'); }

断点演示:程序执行流程

注意:圆括号里“应该”是一个结果值为bool值的表达式,

我们这里用的是“应该”而不是“必须”,因为:

这里JavaScript会把任何变量或表达式转换成bool值!

if(value):如果value不是bool值,除了 '', null,0,undefined,NaN,其他都是true。所以,再次开启神奇之旅吧:

if (3 - 2 > 0) { if (3 - 2) { if (2 - 3 < 0) { if (2 - 3) { if (3 - 3) { if ('飞哥真帅') { if ('0') { if ('0'+0) { if ('0'-0) { if ('') { if (' ') { if (''+'') { if (''-'') { if (a = 986) { //var a = 896; if('源栈'-986){ console.log(true); }

事实上,在实际开发中,因为输入值的不确定性,这一规则会带来无穷无尽的麻烦和bug……

所以,再次牢记:书写JavaScript代码一定要规范规范再规范!

else

在上述需求(大于0显示为正数)的基础上再加一个判断:小于0显示为负数。该怎么写?

if (a > 0) { console.log('正数'); } if (a < 0) { console.log('负数'); }

这样写运行结果没有错,但是有一个 性能 上的问题:

假设 a = 100,它通过了 a > 0 的判断,输出:正数。正数就永远不可能为负数,还需要再走一次 a < 0 的判断么?

断点演示:

所以,这种情况,我们应该使用 else:

if (a > 0) { console.log('正数'); }else { console.log('负数'); }

这里的else不会进行判断:只要没有满足前面的if条件,马上就会进入else分支。

花括号{}

注意上面所有代码,无论是 if() 还是 else ,后面都跟了{}。

如果if/else后面只有一句话,也可以(但强烈建议!原因同C#)省略掉这个{}

演示:添加一句

console.log('over!');

条件运算符

上面的if...else...可以进一步重构:

var result; if (a > 0) { result = '正数'; } else { result ='负数'; } console.log(result);

重构:在不改变代码运行结果的前提下,对代码进行调整优化,是提高代码质量的重要手段!

@想一想@:这算是优化么?还多了一行呢……

因为这种if...else...的情形非常常见,JavaScript(包括很多C系语言)提供了这种写法:

var result = a > 0 //条件 ? '大于等于0' //条件为真时取值 : '小于0'; //条件为假时取值

注意这个由问号(?)和冒号(:)组成的三元运算符只能用于赋值,不能用于其它。

常见菜鸟写法

if(result == true)

if (condition) { return true; } else { return false; }

嵌套组合

上面的例子我们忽略了一点:如果 a=0,那么a既不是负数,也不是整数,我们应该直接输出“零”,这怎么实现?

  1. 方案一:循环嵌套

    if (a === 0) { console.log('零'); } else { if (a > 0) { console.log('正数'); } else { console.log('负数'); } }

  2. 方案二:else if()

    if (a === 0) { console.log('零'); } else if (a > 0) { console.log('正数'); } else { console.log('负数'); }

复杂业务需求

利用if...else的嵌套组合,就可以完成复杂的需求。

比如,源栈可以根据学习时间打折优惠:

  • 4周以下:原价每周888元
  • 25周(满课时):包学会,定价19888元
  • 12周以上:8折
  • 8周以下:9折

代码如何实现?_(一起写)_

if (weeks < 4) { console.log(学费是:${888 * weeks}); } else if (weeks === 25) { console.log(学费是:${17888}); } else if (weeks > 12) { console.log(学费是:${888 * weeks * 0.8}); } else if (weeks < 8) { console.log(学费是:${888 * weeks * 0.9}); }

菜鸟 vs 老鸟

凡是拿着需求就开始写的,都是菜鸟!

上述需求是有问题的:

  • 4周8周以上以下包含不包含4周8周本身?
  • 4周到8周如何处理?
  • 如果week<0,或者weeks>25,甚至是一些非数值输入怎么办?
  • ……

写代码之前,首先明确需求——这就是老鸟和菜鸟的区别!

你以后大概率上会发现:作为一个程序员在工作中伤你最深的、你最最头痛和痛苦的,不是“技术”,而是“需求”——模糊不清的需求、千变万化的需求、稀奇古怪的需求……

整理

补充完善好需求之后,再经过整理(尤其注意顺序/层级)后的代码如下所示:

if (!isNaN(weeks)) { console.log(${weeks}不是数字); } else if (weeks > 25 || weeks < 0) { console.log("${weeks}只能在0和25之间"); } else { if (weeks < 4) { console.log(学费是:${888 * weeks}); } else if (weeks < 8) { console.log(学费是:${888 * weeks * 0.7}); } else if (weeks < 12) { console.log(学费是:${888 * weeks * 0.8}); } else if (weeks < 25) { console.log(学费是:${888 * weeks * 0.9}); } else { console.log(学费是:${17888}); } }

if...else的整理,是程序员的基本功。从一开始就要严格要求自己:

程序不是能跑就行,一定要干净整洁通畅……或者总结为:可读性强!

swith...case

也可以算是if...else...的另一种写法:

var weekday = 3; switch (weekday) { case 1: //if(weekday == 1) console.log('星期一'); break; //:和break类似于 {} case 2: //else if(weekday == 1) console.log('星期二'); break; //省略.... case 6: console.log('星期六'); break; case 7: console.log('星期天'); break; default: //兜底的else

    console.log('什么鬼?'); break; }

注意:

  • 不要忘记break;
  • 推荐总是用default兜底
  • 只能做 “等值” 比较,没有什么

    case weekday > 1: //不会报错,但你猜是什么运行效果?

  • 也没有什么“逻辑”运算,比如:

    case 6 || 7: //同样不会报错,但更加的古怪……

    如果你真想6和7都输出为“周末”,可以:

    case 6: case 7: console.log('周末'); break;

作业

  1. 写一段代码,能根据一起帮用户的帮帮点(bCredit)输出他对应的等级(可适度精简)
  2. 一起帮用户被分为5种,每种都有一个整数代号:

    • 0:访客
    • 1:注册用户
    • 2:文章发布者
    • 3:管理员
    • 4:超级管理员
      写一段代码,用switch...case将代号转换成文字输出,但3和4都统称“管理员”即可

你可能感兴趣的:(javascript)