千锋教育-做有情怀、有良心、有品质的职业教育机构

手机站
千锋教育

千锋学习站 | 随时随地免费学

千锋教育

扫一扫进入千锋手机站

领取全套视频
千锋教育

关注千锋学习站小程序
随时随地免费学习课程

当前位置:首页  >  技术干货  > 如何在JavaScript中更好地使用条件判断

如何在JavaScript中更好地使用条件判断

来源:千锋教育
发布人:wjy
时间: 2022-09-15 10:04:37 1663207477

  这篇文章用很短的时间来介绍如何在 JavaScript 中编写更简单的条件判断,帮助你编写更简洁、更易读的代码。

  假设我们将颜色值转换为十六进制编码的函数。

如何在JavaScript中更好地使用条件判断1

  这个函数的目标很简单,就是传入颜色字符串,然后返回对应的十六进制。如果传入的不是字符串,或者没有传递任何内容,则返回白色的十六进制。

  接下来,我们开始优化这段代码。

  避免直接使用字符串作为条件

  直接使用字符串作为条件的问题在于,当我们拼错时会很尴尬。

如何在JavaScript中更好地使用条件判断2

  为了避免这个错误,我们可以使用常量。

如何在JavaScript中更好地使用条件判断3

  如果你使用的是TypeScript,那么,你可以直接使用枚举。

  使用对象

  其实从上面的代码中不难发现,我们可以直接将十六进制值存储在对象的值中。

如何在JavaScript中更好地使用条件判断4

  这样代码会更加简洁易读。

  不符合预期,早点回来

  另一个最佳实践是我们可以在函数顶部写出意外返回,以避免忘记返回。

如何在JavaScript中更好地使用条件判断5

  这样你甚至不需要 else。使用这个技巧,我们可以消除代码中的很多其他内容。

  将Map与Object一起使用

  使用 Map 更专业,因为它可以存储任何类型的键,并且它继承自 Map.prototype,具有更方便的方法和属性。

  而且Object更方便访问属性,我们可以继续使用Object来实现枚举的作用。

如何在JavaScript中更好地使用条件判断6

  Map也可以存储功能

  假设我们存储了很多颜色,最多上千种,而且我们还需要支持后端配置,通过一定的操作过程可以得到结果。

  然后我们可以使用 Map 来存储函数。

如何在JavaScript中更好地使用条件判断7

  尽量避免三元表达式和switch

  三元表达式虽然简短,但可读性大打折扣。如果是多级条件,阅读起来会很困难。

  switch 和 if 没有明显的优势,但有时很容易返回,导致代码无法按预期执行。

tags:
声明:本站稿件版权均属千锋教育所有,未经许可不得擅自转载。
10年以上业内强师集结,手把手带你蜕变精英
请您保持通讯畅通,专属学习老师24小时内将与您1V1沟通
免费领取
今日已有369人领取成功
刘同学 138****2860 刚刚成功领取
王同学 131****2015 刚刚成功领取
张同学 133****4652 刚刚成功领取
李同学 135****8607 刚刚成功领取
杨同学 132****5667 刚刚成功领取
岳同学 134****6652 刚刚成功领取
梁同学 157****2950 刚刚成功领取
刘同学 189****1015 刚刚成功领取
张同学 155****4678 刚刚成功领取
邹同学 139****2907 刚刚成功领取
董同学 138****2867 刚刚成功领取
周同学 136****3602 刚刚成功领取
相关推荐HOT
开班信息
北京校区
  • 北京校区
  • 大连校区
  • 广州校区
  • 成都校区
  • 杭州校区
  • 长沙校区
  • 合肥校区
  • 南京校区
  • 上海校区
  • 深圳校区
  • 武汉校区
  • 郑州校区
  • 西安校区
  • 青岛校区
  • 重庆校区
  • 太原校区
  • 沈阳校区
  • 南昌校区
  • 哈尔滨校区