JS简易计算器实例讲解


Posted in Javascript onJune 30, 2020

本文实例为大家分享了JS实现简易计算器的具体代码,供大家参考,具体内容如下

简易计算器:

1)选择需要运算的类型,输入对应的数字
2)输入需要参与运算的数字
3)输入“计算”二字,进行运算后,显示运算结果及运算表达式

JS简易计算器实例讲解

<script type="text/javascript">
 // 加法运算
 function plus(arrPlus){
 var sum = 0;
 for(var i = 0 ; i < arrPlus.length ; i++){
 sum = sum + arrPlus[i];
 }
 console.log('函数plus循环后求和结果的数是'+ sum);
 return sum;

 }
 // 减法运算
 function subtract(arrSubtract){
 var substractResult = arrSubtract[0];
 for(var i = 1 ; i < arrSubtract.length ; i++){
 substractResult = substractResult - arrSubtract[i] ;
 }
 return substractResult;
 }
 // 乘法运算
 function multiple(arrMultiple){
 var multipleResult = 1;
 for(var i = 0 ; i < arrMultiple.length ; i++){
 multipleResult = multipleResult * arrMultiple[i];
 }
 return multipleResult;
 }
 // 除法运算
 function divide(arrDivide){
 var divideResult = arrDivide[0];
 for(var i = 1 ; i < arrDivide.length ; i++){
 divideResult = divideResult / arrDivide[i];
 }
 return divideResult; 
 }
 // 输入需要运算的数值
 function calculateNum(num,mention){
 i = 0;
 num = [];
 do{
 // var i = 0;
 mention = prompt('请输入第'+ (i+1) +'个数,注意:'+'输入"计算"二字将获得结果');
 if(mention != '计算'){
 mention = mention * 1;
 num[i]= mention ;
 i++;
 } 
 }while(mention != '计算');
 console.log('calculateNum存入的数值是' + num);
 return num;
 }
 //显示计算表达式
 function formula( arr){
 fom = [] ;
 for(var i =0 ; i < arr.length ; i++){
 if(apply == 1){
 fom = fom + arr[i] + '+';
 }else if (apply == 2){
 fom = fom + arr[i] + '-';
 }else if (apply == 3){
 fom = fom + arr[i] + '*';
 }else if(apply == 4){
 fom = fom + arr[i] + '/';
 } 
 }
 console.log('计算表达式formula函数输出的是' + fom);
 return fom;
 }

 //全局变量
 var i = 0 ;
 var fom = '';
 var num = [];
 var mention = ''
 apply = '';
 do{
 // 计算器主面板
 apply = prompt('欢迎使用简易计算器\n'+'1、加法运算\n'+'2、减法运算\n'+'3、乘法运算\n'+'4、除法运算\n'+'5、退出\n'+'请输入您的选项');
 apply = apply * 1;
 switch(apply){
 case 1:
 var plusInput = calculateNum(num,mention); 
 alert(formula(plusInput)+'计算结果是' + plus(plusInput));
 break;
 case 2:
 var subtractInput = calculateNum(num,mention); 
 alert(formula(subtractInput)+'计算结果是' + subtract(subtractInput));
 break; 
 case 3:
 var multipleInput = calculateNum(num,mention); 
 alert(formula(multipleInput)+'计算结果是' + multiple(multipleInput));
 break;
 case 4:
 var divideInput = calculateNum(num,mention); 
 alert(formula(divideInput)+'计算结果是' + divide(divideInput));
 break; 
 }
 }while(apply != 5)
 alert('欢迎使用!');
</script>

关于计算器功能实现的更多精彩文章请点击专题:计算器实现 学习查看

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript 封装Ajax传递的数据代码
Jun 05 Javascript
Javascript事件热键兼容ie|firefox
Dec 30 Javascript
jquery实现可拖拽弹出层特效
Jan 04 Javascript
JavaScript删除数组元素的方法
Mar 20 Javascript
JavaScript实现Flash炫光波动特效
May 14 Javascript
javascript学习总结之js使用技巧
Sep 02 Javascript
javascript基础练习之翻转字符串与回文
Feb 20 Javascript
完美解决axios跨域请求出错的问题
Feb 05 Javascript
iview tabs 顶部导航栏和模块切换栏的示例代码
Mar 04 Javascript
JavaScript函数IIFE使用详解
Oct 21 Javascript
vue基于v-charts封装双向条形图的实现代码
Dec 09 Javascript
详解Vue的异步更新实现原理
Dec 22 Vue.js
如何在postman中添加cookie信息步骤解析
Jun 30 #Javascript
JSON获取属性值方法代码实例
Jun 30 #Javascript
JS猜数字游戏实例讲解
Jun 30 #Javascript
vue实现评价星星功能
Jun 30 #Javascript
Json实现传值到后台代码实例
Jun 30 #Javascript
vue实现循环滚动列表
Jun 30 #Javascript
js实现简单音乐播放器
Jun 30 #Javascript
You might like
PHP安全配置
2006/12/06 PHP
ThinkPHP3.1新特性之G方法的使用
2014/06/19 PHP
ioncube_loader_win_5.2.dll的错误解决方法
2015/01/04 PHP
Yii获取当前url和域名的方法
2015/06/08 PHP
PHP实现Redis单据锁以及防止并发重复写入
2018/04/10 PHP
编辑浪子版表单验证类
2007/05/12 Javascript
javascript 变量作用域 代码分析
2009/06/26 Javascript
jquery打开直接跳到网页最下面、最低端实现代码
2013/04/22 Javascript
常用jQuery代码分享
2015/07/14 Javascript
微信小程序 网络API发起请求详解
2016/11/09 Javascript
修改ligerui 默认确认按钮的方法
2016/12/27 Javascript
对mac下nodejs 更新到最新版本的最新方法(推荐)
2018/05/17 NodeJs
解决vue-quill-editor上传内容由于图片是base64的导致字符太长的问题
2018/08/20 Javascript
详解webpack 热更新优化
2018/09/13 Javascript
JS/jQuery实现超简单的Table表格添加,删除行功能示例
2019/07/31 jQuery
vue实现手机端省市区区域选择
2019/09/27 Javascript
编写简单的Python程序来判断文本的语种
2015/04/07 Python
Python线程中对join方法的运用的教程
2015/04/09 Python
可能是最全面的 Python 字符串拼接总结【收藏】
2018/07/09 Python
Python常见的pandas用法demo示例
2019/03/16 Python
Python基于scipy实现信号滤波功能
2019/05/08 Python
Python中字符串与编码示例代码
2019/05/20 Python
Python + Flask 实现简单的验证码系统
2019/10/01 Python
python ubplot使用方法解析
2020/01/10 Python
Pytorch保存模型用于测试和用于继续训练的区别详解
2020/01/10 Python
总结30个CSS3选择器
2017/04/13 HTML / CSS
CSS3 :default伪类选择器使用简介
2018/03/15 HTML / CSS
超市创业计划书
2014/04/24 职场文书
创优争先心得体会
2014/09/11 职场文书
考试作弊检讨
2015/01/27 职场文书
项目经理岗位职责范本
2015/04/01 职场文书
2016年优秀党务工作者先进事迹材料
2016/02/29 职场文书
python基于OpenCV模板匹配识别图片中的数字
2021/03/31 Python
《王者天下》第4季首话新剧照 4月9日正式开播
2022/04/07 日漫
python语言中pandas字符串分割str.split()函数
2022/08/05 Python
JS前端使用Canvas快速实现手势解锁特效
2022/09/23 Javascript