我如何修复重叠的数字在if/else语句

how do i fix overlapping numbers in if/else statement?

本文关键字：if else 语句 数字 何修复 重叠      更新时间：2023-09-26

我刚开始学习javascript，我如何修复if/else语句中数字的重叠。我想用早上6点到9点来提醒一条特定的信息，我想用下午5点到8点来提醒另一条不同的信息。

<html>
<head>
<script>
</script>
<title> Javascript program</title>
</head>
<body>
<script>
var hour=eval (prompt("What is the current hour?", ""));
if (hour > 6 && hour <=  9){
alert("Breakfast time ");
}
else if (hour => 11 && hour <= 1) {
alert("Time for lunch");
}
else if (hour => 5 && hour <= 8){
alert("Dinner is served");
}
else{
alert("Sorry, you'll have to wait, or go get a snack");
}
</script>
</body>
</html>

描述

从12小时AM/PM时钟切换到24小时时钟，getHours默认返回。

否则，当提示用户时，您还需要将AM/PM作为下拉菜单。

JavaScript 24小时解决方案

// Removed prompt in favor of just pulling the hour
//var hour=eval (prompt("What is the current hour?", ""));
var hour = new Date().getHours();
// Changed to 24 hour schedule
if (hour > 6 && hour <=  9){
  console.log("Breakfast time ");
} else if (hour >= 11 && hour <= 13) {
  console.log("Time for lunch");
} else if (hour >= 17 && hour <= 20){
  console.log("Dinner is served");
} else{
  console.log("Sorry, you'll have to wait, or go get a snack");
}

JavaScript 12小时AM/PM解决方案

jsFiddle 

<a data-target="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a>
<div class="modal fade hide" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="myModalLabel">Modal header</h3>
  </div>
  <div class="modal-body">
    <input type='text' id='hour'/>
      <select id='AMPM'>
          <option value=0>AM</option>
          <option value=12>PM</option>
      </select>
  </div>
  <div class="modal-footer">
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
    <button class="btn btn-primary" data-dismiss="modal" id='save'>Save changes</button>
  </div>
</div>
JavaScript

var getMeal = function() {
    var hour = parseInt($('#hour').val());
    var AMPM = parseInt($('#AMPM').val());
    if(hour === 12 && AMPM ===0) {
      hour = 0;
    } else {
      hour += AMPM;
    }
    // Changed to 24 hour schedule
    if (hour > 6 && hour <=  9){
      console.log("Breakfast time ");
    } else if (hour >= 11 && hour <= 13) {
      console.log("Time for lunch");
    } else if (hour >= 17 && hour <= 20){
      console.log("Dinner is served");
    } else{
      console.log("Sorry, you'll have to wait, or go get a snack");
    }
};
$(document).ready(function() {
  $('#save').on('click', getMeal);
});

因为你从用户那里得到输入，你真的不知道你会得到什么样的值。

在你的代码中，你假设用户将使用12小时的时钟。使用12小时制的问题是，给定一个数字，例如7，它可能对应于7 am或7 pm。作为一个程序员，你不知道用户的意思是什么，更进一步说，当你使用整数时，你也不能分辨出你自己的代码中的区别。

更好的策略是使用24小时制。给定1到24之间的任何数字，你就知道它是一天中的确切时间。

但是，您仍然不知道用户将如何在提示符中输入值…他们会使用12小时的时间吗?给am/pm ?或者用户24小时时间?我们所能做的就是解析输入，并且只接受来自用户的特定类型的输入。我已经写了一个示例解析器函数与代码注释解释发生了什么。

function parse_input(input) {
  // these are the variable we will use in the function
  var time, matches, am_or_pm;
  // make sure the input variable has been initialised to a string
  input = input || '';
  // check if the input contains a time and am/pm
  matches = input.match(/^([1-9]|10|11|12)'s*(am|pm)/i);
  // try to get the time from the matches
  if (matches) {
    time = parseInt(matches[1]); // Note: may evaluate to NaN
    am_or_pm = matches[2];
  }
  // if there was no match use the original input.
  time = time || parseInt(input); // Note: may evaluate to NaN
  // adjust to 24 hr time if user entered 'pm'
  // Note: we don't need to do anything if the user enters 'am'
  if (am_or_pm && am_or_pm.toLowerCase() == 'pm') {
    time = time + 12;
  }
  return time;
}

然后我们可以重新编写原始代码来使用新的解析器函数和24小时时间:

// get the time from the user as you did before
var input = prompt("What is the current hour?", "");
// use the custom parser function to get the hour of day in 24 hr time
var hour = parse_input(input);
// respond to the user based on the given time 
if (hour > 6 && hour <=  9) {
  alert("Breakfast time ");
}
else if (hour >= 11 && hour <= 13) {
  alert("Time for lunch");
}
else if (hour >= 17 && hour <= 20) {
  alert("Dinner is served");
}
else if (isNaN(hour) || hour > 23 || hour < 1) {
  // Let the user know that their input was not valid
  alert("Sorry, you didn't enter a valid time");
}
else {
  alert("Sorry, you'll have to wait, or go get a snack");
}

最后一件事，我注意到大于或等于的符号是=>。这实际上在最近的Javascript版本中创建了一个函数，并且在if语句中求值为true。正确的符号是>=。

相关文章：