利用JavaScript编写更好条件语句的方法

  介绍

小编给大家分享一下利用JavaScript编写更好条件语句的方法,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获、下面让我们一起去了解一下吧!

在任何编程语言中,代码需要根据不同的条件在给定的输入中做不同的决定和执行相应的动作。

例如,在一个游戏中,如果玩家生命点为0,游戏结束。在天气应用中,如果在早上被查看,显示一个日出图片,如果是晚上,则显示星星和月亮。在这篇文章中,我们将探索JavaScript中所谓的条件语句如何工作。

如果你使用JavaScript工作,你将写很多包含条件调用的代码。条件调用可能初学很简单,但是还有比写一对对if/else更多的东西。这里有些编写更好更清晰的条件代码的有用提示。


使用数组。包括进行多条件选择

例如:

函数printAnimals(动物){
  如果(动物===& # 39;狗# 39;动物===| | & # 39;猫# 39;){
  控制台。日志(我有一个${动物});
  }
  }
  
  console.log (printAnimals(& # 39;狗# 39;));//我有一只狗

上面的代码看起来很好因为我们只检查了两个动物。然而,我们不确定用户输入。如果我们要检查任何其他动物呢?如果我们通过添加更多”或“语句来扩展,代码将变得难以维护和不清晰。

<>强解决方案:

我们可以通过使用数组。包括来重写上面的条件

函数printAnimals(动物){
  const动物=[& # 39;狗# 39;& # 39;猫# 39;,& # 39;仓鼠# 39;,& # 39;龟# 39;];
  
  如果(animals.includes(动物)){
  控制台。日志(我有一个${动物});
  }
  }
  
  console.log (printAnimals(& # 39;仓鼠# 39;));//我有一个仓鼠

这里,我们创建来一个动物数组,所以条件语句可以和代码的其余部分抽象分离出来。现在,如果我们想要检查任何其他动物,我们只需要添加一个新的数组项。

我们也能在这个函数作用域外部使用这个动物数组变量来在代码中的其他任意地方重用它。这是一个编写更清晰,易理解和维护的代码的方法,不是吗?


这是一个精简你的代码的非常酷的技巧。我记得当我开始专业工作时,我在第一天学习使用提前退出来编写条件。

让我们在之前的例子上添加更多的条件。用包含确定属性的对象替代简单字符串的动物。

现在的需求的是:

    <李>如果没有动物,抛出一个异常李 <>李打印动物类型李 <>李打印动物名字李 <>李打印动物性别李
 const printAnimalDetails=动物=比;{
  让结果;//声明一个变量来存储最终值//条件1:检查动物有一个值
  如果(动物){//条件2:检查如果动物有一种属性
  如果(animal.type) {//条件3:检查动物名称属性
  如果(animal.name) {//条件4:检查动物有一个性别属性
  如果(animal.gender) {
  结果=$ {animal.name}是${动物。性别}$ {animal.type};;
  其他}{
  结果=懊挥卸飃ender";
  }
  其他}{
  结果=懊挥卸飊ame";
  }
  其他}{
  结果=懊挥卸飔ype";
  }
  其他}{
  结果=懊挥衋nimal";
  }
  
  返回结果;
  };
  
  console.log (printAnimalDetails ());//& # 39;没有动物# 39;
  
  控制台。日志(printAnimalDetails({类型:“dog"、性别:“female"}));//& # 39;没有动物名称# 39;
  
  控制台。日志(printAnimalDetails({类型:“dog",名字:“Lucy"}));//& # 39;没有动物性别# 39;
  
  console.log (
  printAnimalDetails({类型:“dog",名字:“Lucy",性别:“female"})
  );//& # 39;露西是一个女狗# 39;

你觉得上面的代码怎么样?

它工作得很好,但是代码很长并且维护困难。如果不使用皮棉工具,找出闭合花括号在哪都会浪费很多时间。,# 128516;想象如果代码有更复杂的逻辑会怎么样?大量的如果…其他语句。

我们能用三元运算符,,,条件等语法重构上面的功能,但让我们用多个返回语句编写更清晰的代码。

 const printAnimalDetails=({类型、名称、性别}={})=比;{
  如果(!类型)返回& # 39;没有动物类型# 39;;
  如果(!名字)返回& # 39;没有动物名称# 39;;
  如果(性别)返回& # 39;没有动物性别# 39;;//在这行代码,我们# 39;是确保我们有一个动物//这里的三个属性。
  
  返回${名称}是一个${性别}${类型};
  }
  
  console.log (printAnimalDetails ());//& # 39;没有动物类型# 39;
  
  控制台。日志(printAnimalDetails({类型:狗}));//& # 39;没有动物名称# 39;
  
  控制台。日志(printAnimalDetails({类型:狗、性别:女性}));//& # 39;没有动物名称# 39;
  
  控制台。日志(printAnimalDetails({类型:狗,名字:& # 39;露西# 39;,性别:& # 39;女# 39;}));//& # 39;露西是一个女狗# 39;

利用JavaScript编写更好条件语句的方法