• 用javascript来实现计算用户输入用电量，自动计算出电费多少，分三档计费

                  前言：这个计算出来最后的结果，会存在精度丢失的问题，欢迎大佬提出解决方案

      

    目录

                     第一步·：框架

                     第二步：定义一个变量用来接收用户输入的电量

                     第三步：分析题目

                     第四步：继续根据需求写，现在是第二档大于150小于400的

                     第五步：继续写第三档

                     第六步：输出

     

     

     

                    第一步·：框架

    1. html>
    2. <html>
    3. 	<head>
    4. 		<meta charset="utf-8">
    5. 		<title>title>
    6. 	head>
    7. 	<body>
    8. 		<script>
    9. 		
    10. 		script>
    11. 	body>
    12. html>

            第二步：定义一个变量用来接收用户输入的电量

    1. html>
    2. <html>
    3. 	<head>
    4. 		<meta charset="utf-8">
    5. 		<title>title>
    6. 	head>
    7. 	<body>
    8. 		<script>
    9. 			var electricity = prompt('请输入用电量')
    10. 			
    11. 		script>
    12. 	body>
    13. html>

    这里的话有一个小知识点，如果我们就这样写下去，prompt输出的是String类型的，所以我们需要对其进行转换成数值型Number

    1. html>
    2. <html>
    3. 	<head>
    4. 		<meta charset="utf-8">
    5. 		<title>title>
    6. 	head>
    7. 	<body>
    8. 		<script>
    9. 			var electricity = prompt('请输入用电量')
    10. 			electricity = parseInt(electricity)
    11. 			
    12. 		script>
    13. 	body>
    14. html>

             第三步：分析题目

    题目需求是说如果用户的用电量在150千瓦时以下爱，那么每度电0.4463，接下来我们写上代码

    1. html>
    2. <html>
    3. 	<head>
    4. 		<meta charset="utf-8">
    5. 		<title>title>
    6. 	head>
    7. 	<body>
    8. 		<script>
    9. 			var electricity = prompt('请输入用电量')
    10. 			electricity = parseInt(electricity)
    11. 			var money = 0;
    12. 			if (electricity <= 150) {
    13. 				money = electricity * 0.4463
    14.  
    15. 			}
    16. 		script>
    17. 	body>
    18. html>

    这里的话我们定义一个变量用来接收电费总额，这个变量的作用在后面会显示出来

            第四步：继续根据需求写，现在是第二档大于150小于400的

    1. html>
    2. <html>
    3. 	<head>
    4. 		<meta charset="utf-8">
    5. 		<title>title>
    6. 	head>
    7. 	<body>
    8. 		<script>
    9. 			var electricity = prompt('请输入用电量')
    10. 			electricity = parseInt(electricity)
    11. 			var money = 0;
    12. 			if (electricity <= 150) {
    13. 				money = electricity * 0.4463
    14.  
    15. 			} else if (electricity >= 150 && electricity <= 400) {
    16. 				money = (150 * 0.4463) + ((electricity - 150) * 0.4663)
    17.  
    18. 		script>
    19. 	body>
    20. html>

     这里因为是第二档，第二档要减去第一档的费用，因而要用ele...减去150，剩下的就是超出150，小于400的电量，每度0.4663

    第五步：继续写第三档

    1. html>
    2. <html>
    3. 	<head>
    4. 		<meta charset="utf-8">
    5. 		<title>title>
    6. 	head>
    7. 	<body>
    8. 		<script>
    9. 			var electricity = prompt('请输入用电量')
    10. 			electricity = parseInt(electricity)
    11. 			var money = 0;
    12. 			if (electricity <= 150) {
    13. 				money = electricity * 0.4463
    14.  
    15. 			} else if (electricity >= 150 && electricity <= 400) {
    16. 				money = (150 * 0.4463) + ((electricity - 150) * 0.4663)
    17.  
    18. 			} else  {
    19. 				money = (150 * 0.4463) + ((400 - 150) * 0.4663) + ((electricity - 400) * 0.5663)
    20.  
    21. 			}
    22. 		
    23. 		script>
    24. 	body>
    25. html>

     第三档的条件是大于400千瓦时的，所以我们要在之前的基础上，减去150第一档，减去151到400第二档，剩下的就是第三档，，每度0.5663

    第六步：输出

    1. html>
    2. <html>
    3. 	<head>
    4. 		<meta charset="utf-8">
    5. 		<title>title>
    6. 	head>
    7. 	<body>
    8. 		<script>
    9. 			var electricity = prompt('请输入用电量')
    10. 			electricity = parseInt(electricity)
    11. 			var money = 0;
    12. 			if (electricity <= 150) {
    13. 				money = electricity * 0.4463
    14.  
    15. 			} else if (electricity >= 150 && electricity <= 400) {
    16. 				money = (150 * 0.4463) + ((electricity - 150) * 0.4663)
    17.  
    18. 			} else  {
    19. 				money = (150 * 0.4463) + ((400 - 150) * 0.4663) + ((electricity - 400) * 0.5663)
    20.  
    21. 			}
    22. 			alert('所需支付的费用为' + money + '元');
    23. 		script>
    24. 	body>
    25. html>

     以上就是全部代码和逻辑，如果需要请私信

  • 相关阅读:
    2022年PMP考试应该注意些什么？
    【Android】View 与 ViewGroup
    重制版 day 18 CSV和excel文件操作
    SQL 语言数据操纵语言 DML
    你想过如何让自己变得更好吗？-关于个人成长的思考二
    HTML+CSS+JS实现仿QQ个人资料卡（思路+源码）
    【电控笔记5.7】Notch-Filter滤波器
    k8s-7部署kube-state-metrics监控组件
    ros数据转换
    C++11 - 6 - 可变参数模板
  • 原文地址：https://blog.csdn.net/tea_tea_/article/details/126052176