联系我们
简单又实用的WordPress网站制作教学
当前位置:网站首页 > 程序开发学习 > 正文

JavaScript 用三种方法做一个简易计算器

作者:小教学发布时间:2023-10-02分类:程序开发学习浏览:82


导读:JavaScript用三种方法做一个简易计算器1.普通使用2.创建基本函数3.构造函数创建基本数据类型/使用对象创建1.普通使用<!DOC...

JavaScript 用三种方法做一个简易计算器

  • 1.普通使用
  • 2.创建基本函数
  • 3.构造函数创建


基本数据类型 / 使用对象创建

1.普通使用

<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
</head>

<body>
	<script>
		var str = '欢迎使用简易计算器:\n1. 加法运算;\n2. 减法运算;\n3. 乘法运算;\n4. 除法运算;\n5. 退出:\n请输入您的选项';
		var option = parseInt(prompt(str))
		switch (option) {
			case 1:
				var str1 = parseInt(prompt("请输入第一个数"))
				var str2 = parseInt(prompt("请输入第二个数"))
				alert(str1 + str2)
				console.log("加法运算");
				break
			case 2:
				var str1 = parseInt(prompt("请输入第一个数"))
				var str2 = parseInt(prompt("请输入第二个数"))
				alert(str1 - str2)
				console.log("减法运算");
				break
			case 3:
				var str1 = parseInt(prompt("请输入第一个数"))
				var str2 = parseInt(prompt("请输入第二个数"))
				alert(str1 * str2)
				console.log("乘法运算");
				break
			case 4:
				var str1 = parseInt(prompt("请输入第一个数"))
				var str2 = parseInt(prompt("请输入第二个数"))
				alert(str1 / str2)
				console.log("除法运算");
				break
			case 5:
				console.log("退出");
				break
		}

	</script>
</body>

</html>

2.创建基本函数

<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
</head>

<body>
	<script>
		function jiafa(num1, num2) {
			return num1 + num2
		}
		function jianfa(num1, num2) {
			return num1 - num2
		}
		function chengfa(num1, num2) {
			return num1 * num2
		}
		function chufa(num1, num2) {
			return num1 / num2
		}
		var str = '欢迎使用简易计算器:\n1. 加法运算;\n2. 减法运算;\n3. 乘法运算;\n4. 除法运算;\n5. 退出:\n请输入您的选项';
		var option = parseInt(prompt(str))
		switch (option) {
			case 1:
				var str1 = parseInt(prompt("请输入第一个数"))
				var str2 = parseInt(prompt("请输入第二个数"))
				result = jiafa(str1, str2)
				alert(result)
				console.log("加法运算");
				break
			case 2:
				var str1 = parseInt(prompt("请输入第一个数"))
				var str2 = parseInt(prompt("请输入第二个数"))
				result = jianfa(str1, str2)
				alert(result)
				console.log("减法运算");
				break
			case 3:
				var str1 = parseInt(prompt("请输入第一个数"))
				var str2 = parseInt(prompt("请输入第二个数"))
				result = chengfa(str1, str2)
				alert(result)
				console.log("乘法运算");
				break
			case 4:
				var str1 = parseInt(prompt("请输入第一个数"))
				var str2 = parseInt(prompt("请输入第二个数"))
				result = chufa(str1, str2)
				alert(result)
				console.log("除法运算");
				break
			case 5:
				console.log("退出");
				break
		}

	</script>
</body>

</html>

3.构造函数创建

new关键字执行过程
// 1.new构造函可以在内存中创建了一个空的对象
// 2.this就会指向刚才创建的空对象
// 3.执行构造函数里面的代码 给这个空对象添加属性和方法
// 4.返回这个新对象(所以构造函数里面不需要return)

<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
</head>

<body>
	<script>

		function Counter(num1, num2) {
			this.num1 = num1
			this.num2 = num2
			this.jiafa = function () {
				return num1 + num2
			}
			this.jianfa = function () {
				return num1 - num2
			}
			this.chengfa = function () {
				return num1 * num2
			}
			this.chufa = function () {
				return num1 / num2
			}
		}

		var str = '欢迎使用简易计算器:\n1. 加法运算;\n2. 减法运算;\n3. 乘法运算;\n4. 除法运算;\n5. 退出:\n请输入您的选项';
		var option = parseInt(prompt(str))
		switch (option) {
			case 1:
				var str1 = parseInt(prompt("请输入第一个数"))
				var str2 = parseInt(prompt("请输入第二个数"))
				result = new Counter(str1, str2).jiafa()
				alert(result)
				console.log("加法运算");
				break
			case 2:
				var str1 = parseInt(prompt("请输入第一个数"))
				var str2 = parseInt(prompt("请输入第二个数"))
				result = new Counter(str1, str2).jianfa()
				alert(result)
				console.log("减法运算");
				break
			case 3:
				var str1 = parseInt(prompt("请输入第一个数"))
				var str2 = parseInt(prompt("请输入第二个数"))
				result = new Counter(str1, str2).chengfa()
				alert(result)
				console.log("乘法运算");
				break
			case 4:
				var str1 = parseInt(prompt("请输入第一个数"))
				var str2 = parseInt(prompt("请输入第二个数"))
				result = new Counter(str1, str2).chufa()
				alert(result)
				console.log("除法运算");
				break
			case 5:
				console.log("退出");
				break
			default:
				console.log("输入错误")
				break
		}

	</script>
</body>

</html>

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述
在这里插入图片描述




标签:JavaScript 用三种方法做一个简易计算器_使用js编程实现计算机


程序开发学习排行
最近发表
网站分类
标签列表