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 简单验证代码(用户名,密码,邮箱)
Sep 28 Javascript
js delete 用法(删除对象属性及变量)
Aug 24 Javascript
js函数与php函数的区别实例浅析
Jan 12 Javascript
jQuery实现文本框输入同步的方法
Jun 20 Javascript
jquery实现动静态条形统计图
Aug 17 Javascript
jquery实现带缩略图的可定制高度画廊效果(5种)
Aug 28 Javascript
jQuery zclip插件实现跨浏览器复制功能
Nov 02 Javascript
VUE实现一个分页组件的示例
Sep 13 Javascript
详解React Native开源时间日期选择器组件(react-native-datetime)
Sep 13 Javascript
npm 常用命令详解(小结)
Jan 17 Javascript
Vue 之孙组件向爷组件通信的实现
Apr 23 Javascript
Vue-cli3.X使用px2 rem遇到的问题及解决方法
Aug 08 Javascript
如何在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
PHP4.04简明安装
2006/10/09 PHP
自己前几天写的无限分类类
2007/02/14 PHP
与文件上传有关的php配置参数总结
2013/06/14 PHP
php获取字符串中各个字符出现次数的方法
2015/02/23 PHP
PHP实现唤起微信支付功能
2019/02/18 PHP
验证javascript中Object和Function的关系的三段简单代码
2010/06/27 Javascript
基于JQuery的数字改变的动画效果--可用来做计数器
2010/08/11 Javascript
分享一个我自己写的ToolTip提示插件(附源码)
2013/01/20 Javascript
javascript随机将第一个dom中的图片添加到第二个div中示例
2013/10/08 Javascript
jquery获取tr并更改tr内容示例代码
2014/02/13 Javascript
javascript中的取反再取反~~没有意义
2014/04/06 Javascript
Jquery方式获取iframe页面中的 Dom元素
2014/05/07 Javascript
jQuery 重复加载错误以及修复方法
2014/12/16 Javascript
12行javascript代码绘制一个八卦图
2015/04/02 Javascript
javascript实现表单提交后,提交按钮不可用的方法
2015/04/18 Javascript
详解WordPress开发中get_current_screen()函数的使用
2016/01/11 Javascript
一个用jquery写的判断div滚动条到底部的方法【推荐】
2016/04/29 Javascript
移动端H5开发 Turn.js实现很棒的翻书效果
2016/06/20 Javascript
JavaScript 中 avalon绑定属性总结
2016/10/19 Javascript
新手vue构建单页面应用实例代码
2017/09/18 Javascript
H5实现仿flash效果的实现代码
2017/09/29 Javascript
html中通过JS获取JSON数据并加载的方法
2017/11/30 Javascript
基于jquery trigger函数无法触发a标签的两种解决方法
2018/01/06 jQuery
JS运动特效之同时运动实现方法分析
2018/01/24 Javascript
微信小程序MUI导航栏透明渐变功能示例(通过改变rgba的a值实现)
2019/01/24 Javascript
Vue实现简单计算器案例
2020/02/25 Javascript
javascript中layim之查找好友查找群组
2021/02/06 Javascript
[03:09]2014DOTA2国际邀请赛 Mushi前队友送上祝福
2014/07/12 DOTA
Python中Django框架下的staticfiles使用简介
2015/05/30 Python
详解Python的Django框架中的模版继承
2015/07/16 Python
Python探索之Metaclass初步了解
2017/10/28 Python
行政管理专业推荐信
2013/11/02 职场文书
植树节口号
2014/06/21 职场文书
高三毕业评语
2014/12/31 职场文书
教师节表彰会主持词
2015/07/06 职场文书
Python离线安装openpyxl模块的步骤
2021/03/30 Python